您的位置:首頁技術文章
文章詳情頁

vue element和nuxt的使用技巧分享

瀏覽:12日期:2022-10-10 18:42:29
1.element的時間選擇提交的格式轉化

例如

Fri Sep 07 2018 00:00:00 GMT+0800 (中國標準時間)轉化為 2020-01-11的格式

這記載datepicker中添加一句value-format=”yyyy-MM-dd”

<el-date-picker type='date' v-model='createdate' @change='formatTime' value-format='yyyy-MM-dd' placeholder='選擇時間'></el-date-picker>2.動態循環復選框時,無法選中問題

this.menulist[index].sonList.map((item)=>{ this.$set(item, ’checked’, false); ---用vue的set屬性賦值})3.el-form動態表單驗證(v-if、v-show導致校驗失效的bug)

當使用v-if或v-show來控制el-form-item的顯示與隱藏時,會出現校驗失效的bug。

使用v-if:element在對form表單中帶有prop屬性的子組件進行校驗規則綁定時,是在vue聲明周期mounted完成的。而v-if用來切換的元素是會被銷毀的,導致了v-if內的表單項,由于在mounted時期沒有進行渲染,所以規則也沒

有綁定上。初始化時不符合顯示條件的不會生成規則,導致后面切換條件,顯示的輸入框的校驗不會生效 使用v-show:初始化時會生成所有的規則,即使隱藏了也會進行規則校驗

解決方法(1)、使用v-if進行校驗 每個v-if后面配置一個不同的key值,這樣就可以了

(2)、自定義校驗規則,喜歡動手的可以自己自定義校驗

4、nuxt如何添加Devtools工具

必須將以下內容添加到nuxt.config.js:

vue: { config: { productionTip: false, devtools: true }}

以上就是vue element和nuxt的使用技巧分享的詳細內容,更多關于vue關于element和nuxt的資料請關注好吧啦網其它相關文章!

標簽: Vue
相關文章:
国产综合久久一区二区三区