上一篇帖子售貌,詳細(xì)介紹了如何利用vue-cli成功搭建一個小型的項目。
? ? 可是這樣還是有問題的疫萤,因為真正的項目肯定不會是這么簡單颂跨。這個時候,就需要引入在vue中比較經(jīng)典的知識了扯饶。
vue路由恒削!
在我看來,路由應(yīng)當(dāng)是在傳值之前要進(jìn)行說明的尾序。下圖是整個用腳手架搭建出來的項目結(jié)構(gòu):
上圖中的項目結(jié)構(gòu)詳細(xì)介紹钓丰。
首先整個項目是放在myVue文件夾中。App.vue文件相當(dāng)于整個項目項目中的父級路由每币,
router文件夾中的index.js携丁,則是設(shè)置路由的具體文件。當(dāng)將組件頁面引入到該項目中兰怠,需要在該js中注冊梦鉴。
圖中所示是一個簡單的有兩個路由的項目。
下面這張圖片中的index.js中的詳細(xì)內(nèi)容揭保,
上述中,你首先需要運用import 去引入你的路由組件掖举,然后注冊在這里的js中快骗。
假如,你在index.vue中創(chuàng)建了一個button按鈕塔次, 在 button 按鈕上 引入@click = “click”點擊方法方篮。
接著在js中,利用? this.$router.push('/two'); 這樣就實現(xiàn)了從路由 index 跳轉(zhuǎn)到 two 的操作了励负。
歸根結(jié)底藕溅,先注冊,再引用继榆,是vue中的基操了巾表。