vue中data數(shù)據(jù)之間如何賦值問(wèn)題
vue data數(shù)據(jù)之間如何賦值
最近我妹突然問(wèn)我vue的data之間需要進(jìn)行賦值,這是什么奇葩需求,干嘛不直接自己定義好就好了啊,既然有這種場(chǎng)景,那么我們就需要去解決這種場(chǎng)景。
實(shí)現(xiàn)方式
<template> ? <div> ? ? ?<Input v-model="dictValue" placeholder="請(qǐng)輸入字典的值" clearable style="width: 200px" /> ? </div> </template> <script> ? ? export default { ? ? ? ? data () { ? ? ? ? ? ? return { ? ? ? ? ? ? ? ? initValue: '默認(rèn)值', ? ? ? ? ? ? ? ? // 錯(cuò)誤的使用方式 ? ? ? ? ? ? ? ? // dictValue: this.initValue ? ? ? ? ? ? ? ? dictValue:'' ? ? ? ? ? ? } ? ? ? ? }, ? ? ? mounted(){ ? ? ? ? // 正確的初始化方式 ? ? ? ? this.dictValue = this.initValue ? ? ? } ? ? } </script>
以上的代碼大家可以直接在https://run.iviewui.com/sCE69xV2這個(gè)地址上運(yùn)行即可驗(yàn)證
vue Data數(shù)據(jù)賦值變量語(yǔ)法
computed: { pickerOptions() { ? ? ? let _this = this; ? ? ? return { ? ? ? ? disabledDate(time) { ? ? ? ? ? let time1 = _this.time; // 動(dòng)態(tài)起始時(shí)間 ,這個(gè)時(shí)間是已經(jīng)得到的時(shí)間戳 ? ? ? ? ? return time.getTime() > new Date(time1); ? ? ? ? }, ? ? ? }; ? ? }, }
采用計(jì)算屬性 取data中的變量進(jìn)行賦值。
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue通過(guò)elementUI組件實(shí)現(xiàn)圖片預(yù)覽效果
我們?cè)陂_(kāi)發(fā)中經(jīng)常會(huì)遇到通過(guò)點(diǎn)擊某個(gè)按鈕或者文字實(shí)現(xiàn)圖片的預(yù)覽功能,這里我們分別介紹vue2和vue3里面如何實(shí)現(xiàn)圖片預(yù)覽方法,需要的朋友可以參考下2023-09-09vue+elementui(對(duì)話(huà)框中form表單的reset問(wèn)題)
這篇文章主要介紹了vue+elementui(對(duì)話(huà)框中form表單的reset問(wèn)題),具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-05-05vue3按鈕點(diǎn)擊頻率控制的實(shí)現(xiàn)示例
在前端開(kāi)發(fā)中,當(dāng)用戶(hù)頻繁連續(xù)點(diǎn)擊按鈕,可能會(huì)導(dǎo)致頻繁的請(qǐng)求或者觸發(fā)過(guò)多的操作,本文主要介紹了vue3按鈕點(diǎn)擊頻率控制的實(shí)現(xiàn)示例,感興趣的可以了解一下2024-01-01vue 設(shè)置 input 為不可以編輯的實(shí)現(xiàn)方法
今天小編就為大家分享一篇vue 設(shè)置 input 為不可以編輯的實(shí)現(xiàn)方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09vue獲取時(shí)間戳轉(zhuǎn)換為日期格式代碼實(shí)例
這篇文章主要介紹了vue獲取時(shí)間戳轉(zhuǎn)換為日期格式,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04npm安裝vue@cli報(bào)錯(cuò)的簡(jiǎn)單處理方式
最近工作中遇到了報(bào)錯(cuò),現(xiàn)在將解決的辦法分享給大家,下面這篇文章主要給大家介紹了關(guān)于npm安裝vue@cli報(bào)錯(cuò)的簡(jiǎn)單處理方式,文中通過(guò)圖文介紹的非常詳細(xì),需要的朋友可以參考下2022-12-12解決vue-router路由攔截造成死循環(huán)問(wèn)題
這篇文章主要介紹了解決vue-router路由攔截造成死循環(huán)問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-08-08