zoukankan      html  css  js  c++  java
  • Vue 2.0 的路由如何从一个单文件组件启动?

    import Vue from 'vue';
    import App from './app.vue';
    import router from './router';
    
    var app = new Vue({
        el: '#app',
        router,
        render: h => h(App)
    });
    import _ from 'lodash';
    import Vue from 'vue'
    import router from 'vue-router'   
    //会报错

     

                       因为这个地方 import router from 应该换成 "./src/router"  

        看下router文件夹里面的 index.js

            所以变成这样的单文件路由启动 , 应该是

    import Vue from 'vue'
    import router from './src/router'
    import App from './app.vue'

    new Vue({
    el: '#app',
    router,
    render: h => h(App)
    })
    
    import App from './app.vue'
    
    new Vue({
            el: '#app',
            router,
            render: h => h(App)
        })
        // 等同于
        // new Vue({
        //     router,
        //     render: (h) => h(app)
        //   }).$mount('#app')

    https://segmentfault.com/q/1010000006558033

     

     

    下面附上正确的单文件路由方法

    main.js

    import Vue from 'vue'
    import router from './src/router'
    import App from './app.vue'
    
    new Vue({
            el: '#app',
            router,
            render: h => h(App)
        })
        // 等同于
        // new Vue({
        //     router,
        //     render: (h) => h(app)
        //   }).$mount('#app')

    router/index.js

    import Vue from 'vue'
    import VueRouter from 'vue-router'
    Vue.use(VueRouter)
    
    const routes = [{
        path: '/home',
        component: (resolve) => require(['../views/home.vue'], resolve)   //http://www.rxshc.com/61.html
    
    }]
    
    // // 路由配置
    const router = new VueRouter({
        routes
    })
    export default router

  • 相关阅读:
    dotNet程序保护方案
    网络数据包捕获函数库Libpcap安装与使用(非常强大)
    Objectivec 中 nil, Nil, NULL和NSNull的区别
    对象的相等和恒等
    IOS SDK介绍
    iOS内存管理编程指南
    http权威指南读书笔记(三)——http报文
    http权威指南学习笔记(二)
    http权威指南读书笔记(一)
    CentOS 设置环境变量
  • 原文地址:https://www.cnblogs.com/MR-cui/p/8430701.html
Copyright © 2011-2022 走看看