最近在開發(fā)交互比較友好的后臺(tái)系統(tǒng)采用了vue-admin-element恭陡，同時(shí)也發(fā)現(xiàn)了一些自己沒用過的語法和技術(shù)摆昧，特在此做下總結(jié)：
1.本次第一次使用到了fuse.js此包為用來模糊搜索的輕量級(jí)包载矿，可對搜索結(jié)果的各個(gè)屬性進(jìn)行權(quán)重設(shè)置漆羔，結(jié)構(gòu)支持較為深入可以嚴(yán)格搜索也可以模糊搜索剿干；
2.路由的懶加載的書寫方式為：const login = r =>
require.ensure([], () => r(require('@/views/login/index')), 'login')
3./deep/的css處理方法，用于scoped下只局限對全局的組件進(jìn)行樣式的更改
4.scss暴漏至外部充當(dāng)變量的方法$text: #000;命名之后 使用:export{menuText:$text} 對外進(jìn)行變量 的暴漏入下圖：
5.Object.getOwnProperty用于返回對象的自有屬性怕磨，包括可枚舉和不可枚舉的
Object.keys()返回一個(gè)數(shù)組喂饥，成員是參數(shù)對象自身的（不含繼承的）所有可遍歷（ enumerable ）屬性的鍵名
Object.values()方法返回一個(gè)數(shù)組，成員是參數(shù)對象自身的（不含繼承的）所有可遍歷（ enumerable ）屬性的鍵值肠鲫。
Object.entries方法返回一個(gè)數(shù)組员帮，成員是參數(shù)對象自身的（不含繼承的）所有可遍歷（ enumerable ）屬性的鍵值對數(shù)組
Array.entries方法返回一個(gè)數(shù)組的迭代對象，該對象包含數(shù)組的鍵值對 (key/value)导饲。
迭代對象中數(shù)組的索引值作為 key捞高， 數(shù)組元素作為 value氯材。需要用for ... of來遍歷新的對象
6.vuex中actions里的方法中第一個(gè)參數(shù)中我們可以獲取，commit,state,dispatch
7.$nextTick,vue中的DOM更新是異步的硝岗，此函數(shù)提供在DOM更新后獲取到更新的數(shù)據(jù)進(jìn)行DOM操作
8.在router-link上綁定click事件是不會(huì)觸發(fā)的氢哮，只有綁定到.native上才會(huì)觸發(fā)
9.@click.left/right/middle 代表鼠標(biāo)的左，右型檀，中鍵觸發(fā)
10.@contextmenu觸發(fā)右鍵彈出菜單
11.this.$router.replace({path: '/redirect'+ fullPath})重新導(dǎo)向路由刷新
12.rectObject = object.getBoundingClientRect();
rectObject.top：元素上邊到視窗上邊的距離;
rectObject.right：元素右邊到視窗左邊的距離;
rectObject.bottom：元素下邊到視窗上邊的距離;
rectObject.left：元素左邊到視窗左邊的距離;
13.樣式中從根目錄引入其他樣式寫法結(jié)構(gòu)為“@import ''~@/文件夾”
14.this.$router.replace({path: '/redirect'+ fullPath})重新導(dǎo)向路由刷新
15.this.$el它指的是當(dāng)前組件的的元素,在mounted之后才有
16.讓flex在一行指定幾個(gè)items命浴，節(jié)點(diǎn)設(shè)置成橫向flex布局，每個(gè)子節(jié)點(diǎn)設(shè)置百分比寬度
17.store中不同模塊之間的調(diào)用方法贱除，屬性需要涉及調(diào)用root級(jí)，如：dispatch('app/updateLocation',{key_root:data},{root:true});
18.在登錄頁媳溺，因自動(dòng)登錄跳轉(zhuǎn)時(shí)月幌，需在router中攔截并next({...to, replace: true})，阻止用戶誤操作跳轉(zhuǎn)回到登錄頁或者無限鎖死的情況
19.在vue-cli中悬蔽，我們在webpack.base.config.js中給scss配置loader后扯躺，當(dāng)在此加載會(huì)報(bào)錯(cuò)Invalid CSS after "...load the styles": expected 1 selector or at-rule, was "var content = requi"這是因?yàn)轫?xiàng)目加載了2此sass-loader，第一次是在build/utils.js中蝎困，將這里得loader注釋掉即可：
20.在實(shí)現(xiàn)多層組件監(jiān)聽,在中間層組件里給下游組件傳遞v-bind="$attrs" v-on="$listeners" 給中間層組件自己加上屬性inheritAttrs: false
21.在使用el-table的時(shí)候录语，當(dāng)我們需要在table綁定的data里動(dòng)態(tài)添加屬性，并讓此屬性與input雙向綁定禾乘，如下圖
但這樣單純的添加并不能實(shí)現(xiàn)數(shù)據(jù)的雙向綁定澎埠，需要調(diào)用vue的$set激活此屬性的響應(yīng)機(jī)制：
再有種情況，外部再想el-table里的data里push新的數(shù)據(jù)的時(shí)候 始藕，沒錯(cuò)我們需要再次對新的data進(jìn)行$set來激活動(dòng)態(tài)添加的屬性的響應(yīng)機(jī)制：
當(dāng)el-table里的雙向綁定的動(dòng)態(tài)屬性變動(dòng)時(shí)蒲稳，無需對tableData進(jìn)行再次$set自動(dòng)響應(yīng)
22.此次開發(fā)需要用到一些動(dòng)畫，現(xiàn)在一些動(dòng)畫進(jìn)行初步的一些總結(jié)：transition對dom的屬性進(jìn)行監(jiān)督伍派，當(dāng)屬性發(fā)生數(shù)值變化（自適應(yīng)不會(huì)觸發(fā)）的時(shí)候會(huì)觸發(fā)transiton動(dòng)畫江耀；animate為自定義動(dòng)畫的，可以分步诉植，可以多個(gè)隊(duì)列祥国，分兩種形式為C3形式寫在css中的和Vue中包裝過的transition標(biāo)簽，觸發(fā)機(jī)制是在DOM元素出現(xiàn)和消失的時(shí)候
23.關(guān)于el-table在flex盒子布局下不自適應(yīng)的問題：https://blog.csdn.net/weixin_30270561/article/details/99082260
24.對于在el-table中的拓展項(xiàng)template標(biāo)簽包裹中晾腔，必須講slot-scope="scope"屬性添上舌稀，否則該template下的內(nèi)容不會(huì)隨內(nèi)容響應(yīng)更新
