javascript - webpack中使用vue路由设置不报错,但是不能显示啊啊
问题描述
设置好了vue路由,npm run dev一下,不报错,但是路由不生效啊代码如下:
//引入路由模块import VueRouter from ’vue-router’//使用路由模块Vue.use(VueRouter);//加载组件import home from ’./components/Home/home.vue’;//创建路由对象const router = new VueRouter({ //配置router-link 指向的路由发生变化时候,当前a标签增加的激活样式 routes: [{name: ’Home’, path: ’/home’, component: home}, ]})var vm = new Vue({ el: ’#app’, render: h => h(app), //h 是 createElement这个函数 编译app.vue组件 //使用路由对象 router: router});`请输入代码`还有: <template> <p class='mui-content'>home </p></template><script> export default {data () { return{ }} }</script><style scoped></style>图片:![图片描述][1]
问题解答
回答1:好像是这样
vue-router
回答2:你没有贴App.vue中的代码 我不知道你写了没有
Vue.use(Router)Vue.use(Vuex)export default new Router({ routes: [ { path: ’/’, component: App, redirect:’/in_theaters’}, { path: ’/in_theaters’, component: in_theaters, },{ path: ’/coming_soon’, component: coming_soon, }, { path: ’/top250’, component: top250, }, { path:’*’, redirect:’/’ } ]})
配置完路由之后 要在App.vue中引用路由路径 这个content 大概的意思就是这个地方加载 你的Home.vue
<el-col :md='14' :lg='18' class='content'><router-view></router-view> </el-col>