tofacebook.com -专业IT技术社区 vue.js路由 Web程序【tofacebook.com】 - tofacebook.com-专业IT技术社区
43°

vue.js路由 Web程序【tofacebook.com】

标签:tar   view   hid   pad   class   主页   start   hold   height   

vue.js路由

1,主页的路由调用 APP.vue

 

    <div class="tab">
      <div class="tab-item">
        <a v-link="{path:‘/goods‘}">商品</a>
      </div>
      <div class="tab-item">
        <a v-link="{path:‘/ratings‘}">评论</a>
      </div>
      <div class="tab-item">
        <a v-link="{path:‘/seller‘}">商家</a>
      </div>
    </div>
   <!--  路由外链 -->
    <router-view></router-view>

 

2,路由设置 main.js

//引入 路由
import VueRouter from ‘vue-router‘

// 引入路由路由组件
import goods from ‘./components/goods/goods.vue‘
import ratings from ‘./components/ratings/ratings.vue‘
import seller from ‘./components/seller/seller.vue‘

// 使用路由
Vue.use(VueRouter);

// 挂载点
let app = Vue.extend(App);

// 显示的路由样式
let router = new VueRouter({
    linkActiveClass:‘active‘
});

// 路由声明
router.map({

    ‘/goods‘:{
        component:goods
    },
    ‘/ratings‘:{
        component:ratings
    },
    ‘/seller‘:{
        component:seller
    }        
});

// 路由开始
router.start(app,‘#app‘);

// 默认是到goods页
router.go(‘/goods‘);

 

vue.js路由

标签:tar   view   hid   pad   class   主页   start   hold   height   

原文地址:http://www.cnblogs.com/21haoxingxiu/p/7267432.html


本文由百家号/熊掌号作者上传并发布,百家号仅提供信息发布平台。文章仅代表作者个人观点,不代表百度立场。

已有 0 条评论

    我有话说: