文章詳情頁

javascript - webpack中使用vue路由設置不報錯，但是不能顯示啊啊

瀏覽：113日期：2023-09-26 08:57:30

問題描述

設置好了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：

好像是這樣 javascript - webpack中使用vue路由設置不報錯，但是不能顯示啊啊

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>