首頁猿問求大佬指點哈！表單改變，計算屬性在...

求大佬指點哈！表單改變，計算屬性在與之前計算值相等時，表單沒有發(fā)生改變？感激不盡

JavaScript

郎朗坤 2019-10-18 08:53:03

表單中奇數(shù)次按下字母，總會多一個字符串text:{{text}}myInt:{{myInt}}請在下表單中繼續(xù)輸入字符串測試exportdefault{name:'test',data(){return{text:123456,}},computed:{myInt:{cache:false,get:function(){returnthis.text;},set:function(value){this.text=value.toString().replace(/[^\d]/g,'');console.log(value)}}}}

查看完整描述

2 回答

慕尼黑的夜晚無繁華

TA貢獻1864條經(jīng)驗獲得超6個贊

原因是數(shù)據(jù)發(fā)生改變視圖才會重新渲染當(dāng)你輸入值value值發(fā)生變化然后被你替換還是原來是值也就是說myInt拿到的值沒有發(fā)生變化所以視圖沒有重新渲染文本框值也就不會變化computed這邊用也是不合適如果你想input輸入受控可以使用input||change事件

反對回復(fù) 2019-10-18

米琪卡哇伊

TA貢獻1998條經(jīng)驗獲得超6個贊

cache已經(jīng)從vue2.0中移除計算屬性是依賴data中的屬性進行監(jiān)聽的，也就是說，你這里用到的v-modal是基于text進行驅(qū)動的當(dāng)UI的值（也就是這里的input）發(fā)生變化的時候，實際的流程是下面這樣（1）用戶輸入-->（2）inputdom的值發(fā)生修改-->（3）觸發(fā)事件監(jiān)聽-->（4）computed中的set執(zhí)行-->（5）vue對比緩存-->（61）如果發(fā)生變化觸發(fā)get，更新dom-->（62）如果沒有發(fā)生變化，不觸發(fā)get，dom不變