vue-router
FAQ
1 Vue-Router基本介紹
1.1 基本介紹
Vue Router：Vue.js的官方路由管理器
Vue Router+Vue.js 構建單頁面應用
?
路由出口，路由匹配到的組件將渲染在這里
vue-router使用：
定義路由：
const routes = [
{path: '/a', component: A},
{path: '/b', component: B}
]
創(chuàng)建router實例：
const router = new Router({routes})
this.$router 訪問路由器
this.$route 訪問當前路由
1.2 動態(tài)路由匹配
動態(tài)路徑參數(shù)：以冒號開頭，后跟參數(shù)名
訪問動態(tài)路徑參數(shù)： this.$route.params.參數(shù)名
響應路由參數(shù)的變化：
組件實例復用：
/activityDetail/id1 -> /activityDetail/id2
組件的生命周期鉤子不會再被調用
1.3 嵌套路由
children配置參數(shù)：
以/開頭的嵌套路徑會被當作根路徑
children中定義的component會被渲染在根組件Layout的<router-view></router-view>中
1.4 路由導航
<router-link to=''></router-link>
相當于<a>標簽
js:
this.$router.push(`/url`);
該方法參數(shù)實例：
this.$router.push('index')
this.$router.push({path: 'index'})
this.$router.push({name: 'user', params: {userId: 123})
this.$router.push({path: 'user', query:{userId: 123}})
命名路由：
定義：
const routes = [
{path: '/a', name: 'a', component: A},
]
使用：
this.$router.push({name: 'a'})
1.5 重定向
通過路由定義配置來完成：
redirect參數(shù)：
2 FAQ
2.1 v-bind
v-bind用于屬性綁定
與直接給屬性賦值不同的是：v-bind綁定的屬性值是動態(tài)變化的數(shù)據(jù)
2.2 TypeError: _self.$scopedSlots.default is not a function
解決方法1：
給兩個table各添加一個獨立的key屬性邦危，來表示這兩個元素是獨立的捕犬，不需要進行復用；
解決方法2:
使用v-show代替v-if
v-show和v-if的區(qū)別：
v-if 惰性的砖茸，若條件為false則不會渲染隘擎；
v-show 不管條件是true還是false都會渲染，渲染是通過改變CSS的display樣式凉夯；
2.3 mongodb:E11000 duplicate key error collection
問題描述：
mongodb在插入數(shù)據(jù)時出現(xiàn)id重復的錯誤
內部原因分析：
同時插入兩條數(shù)據(jù)货葬，導致數(shù)據(jù)庫生成了同一個id值采幌；
外部原因分析：
每次使用同一個變量存儲不同的數(shù)據(jù)，導致數(shù)據(jù)庫認為每次存儲的是同一條數(shù)據(jù)震桶，最終生成同一個id值休傍；
