vue vue-element-admin專案踩坑小結
1.elementui中input繫結change事件,以為可以實現使用者名稱的即時重新整理,但是效果不行,還是要等失去焦點後才會觸發,修改@change替換為@input,可實現即時重新整理。
2.table新增loading效果,修改行樣式
<el-table
v-loading="dataLoading" // loading控制引數dataLoading 預設false
:header-cell-style="{background:'#f5f5f5'}"
:default-sort="{prop: 'date', order: 'descending'}"
:row-style="changeRowcss" // 修改當行的樣式
element-loading-background="rgba(0,0,0,0.2)"
element-loading-text="資料載入中"
element-loading-spinner="el-icon-loading"
>
在js中寫
changeRowcss(row) { // 根據返回資料修改table中特定行樣式
if (row.row.role === 0) {
return 'color:#999' // 修改有特定屬性的一行中的樣式
}
},
3.vue元件每次開啟後的重新整理
使用ref和v-if同時去繫結一個元件,v-if預設為false,在關閉元件的@close 方法回撥中新增 元件狀態引數 設定為false
4.key值重複的報錯,一般情況都是v-for=“item in obj” 迴圈的時候沒有給item加上索引 這樣 v-for=“(item,index) in obj” :key = index這樣就不會報錯 key值重複了
相關文章
- vue-element-admin 使用過程中踩坑Vue
- Laravel 5.8 集合 vue-element-admin 踩坑記LaravelVue
- vue專案中踩過的element的坑Vue
- Vue + TypeScript 踩坑總結VueTypeScript
- vue專案中富文字編輯器踩坑之旅Vue
- vue+elementUI專案的踩坑~~持續更新VueUI
- vue-cli + es6 + axios專案踩坑VueiOS
- vue-element-admin 入坑記(一)vue-element-admin 中文Vue
- 小程式實戰踩坑之B2B商城專案總結
- vue2專案,踩坑Jest單元測試Vue
- 使用vue-cli3建立專案,踩坑記錄Vue
- vue踩坑Vue
- vue npm 搭建專案 流程及備忘及不踩坑VueNPM
- vuePC專案踩坑記錄Vue
- React專案踩坑記錄React
- 小程式開發-mpvue構建小程式專案-1-踩坑Vue
- vue2專案升級至vue3方案步驟踩坑Vue
- vue 踩坑記Vue
- 小程式踩坑填坑
- 小程式踩坑
- 【Vue】Vue1.0+Webpack1+Gulp專案升級構建方案的踩坑路VueWeb
- django專案部署到centos,踩的坑DjangoCentOS
- Laravel Homestead踩坑記2——建立專案Laravel
- 豐田專案踩坑手記(REACT)React
- vue 踩坑-This dependency was not foundVue
- Vue踩坑之旅——methodsVue
- Vue踩坑之旅——VuexVue
- 使用setInterval與clearInterval踩的小坑總結
- 小程式踩坑(2)
- [小程式] mpVue 踩坑Vue
- 記:css繪製小豬佩奇的專案及踩過的坑CSS
- 【踩坑筆記】專案出現Permission denied筆記
- IDEA建立Maven專案中踩過的坑IdeaMaven
- mpvue小程式以及微信直播踩坑總結Vue
- Vue1.0+Webpack1+Gulp專案升級構建方案的踩坑路VueWeb
- electron-vue 打包踩坑Vue
- vue系列之踩坑之旅Vue
- mpvue小程式踩坑之旅Vue