vue组件,路由及组件跳转,

-组件的使用 
<!-- 1、父组件中引入组件  import Home from "./components/Home";
        2、注册组件  components:{'v-home':Home,},
        3、使用组件   <v-home></v-home>
        -->
 
-路由及组件跳转
<!--
1、安装并保存
npm install vue-router --save

2、在main.js里引入并使用
import VueRouter from 'vue-router'
Vue.use(VueRouter)

3、在main.js里路由配置
    1.创建组件 引入组件
    import Router from "./components/06Router";

    2.定义路由
    const routes = [
        {path:'/router',component:Router},
        {path:'/bar',component:Bar}
        ]
    
    3.实例化VueRouter
    const router=new VueRouter({
        routes  //缩写(routes:routes)
    })

    4.挂载
    new Vue({
        el:'#app',
        router,
        render:h => h(App)
    })

    5.在App.vue里使用(路由匹配到的组件将显示在这里)
    <router-view></router-view>
-->

猜你喜欢

转载自www.cnblogs.com/wangdongwei/p/11992419.html
今日推荐