在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue input校驗(yàn)實(shí)現(xiàn)輸入框?qū)崟r(shí)更新遇到的問題

vue input校驗(yàn)實(shí)現(xiàn)輸入框?qū)崟r(shí)更新遇到的問題

問題描述，在使用vue input校驗(yàn)輸入內(nèi)容并且實(shí)時(shí)更新輸入框不生效

<div class="app">
    <input v-bind:value="something" v-on:input="update">
</div>
    var app = new Vue({
        el: ".app",
        data: {
            something: '123'
        },
        methods: {
            update: function (e) {
                this.something = 111; //只會(huì)第一次輸入后生效
                e.target.value = 111; //如果不手動(dòng)將value設(shè)置111，不會(huì)實(shí)時(shí)更新input
            }
        }
    })

**問題在于，使用this.something = 111這一句后，在第一次輸入時(shí)，input中內(nèi)容確實(shí)變成了111
但是隨后的輸入input中的內(nèi)容就不是111了，隨著輸入內(nèi)容改變了（難道第一次出發(fā)了watcher，隨后緩存了？是為了避免每次input更改觸發(fā)watcher而引起的性能損耗么？），只有手動(dòng)設(shè)置e.target.value = 111才能生效，所以為什么會(huì)第一次生效而后不會(huì)生效呢？**

**新增：重申下，我問的不是實(shí)現(xiàn)方式，而是為何會(huì)出現(xiàn)這種現(xiàn)象的原因，不要再說什么v-model,v-model就是:value="som" @input="som = $event.target.value" 的語法糖，
其中som = $event.target.value其實(shí)就是等于上面的e.target.value = 111，問題在于為何直接為data賦值第一次有效果后面無效**

回答
編輯回答
我以為

data() {

        return {
           something: '123'
        }
    }

把data按照這種方式試下

2018年5月30日 04:43
編輯回答
淡墨

data應(yīng)該是一個(gè)函數(shù)，返回所有變量屬性組成的對(duì)象

2017年9月21日 11:24
編輯回答
歆久

watch的是data里面的something.(簡(jiǎn)寫sth)
第一次觸發(fā)update時(shí). sth = 123 ;然后 執(zhí)行 this.sth = 111;
第二次你觸發(fā)update時(shí)， sth = 111 ; watcher會(huì)認(rèn)為你并沒有修改sth 所以沒有進(jìn)行DOM更新 . 也就是你只能手動(dòng) e.target.value ....

2018年7月5日 04:39
編輯回答
檸檬藍(lán)

用v-model

2017年7月19日 00:37