鍍金池/ 問(wèn)答/HTML/ v-model 綁定動(dòng)態(tài)變量怎么實(shí)現(xiàn),求賜教,急急急!

v-model 綁定動(dòng)態(tài)變量怎么實(shí)現(xiàn),求賜教,急急急!

clipboard.png
如圖,showColumns是一個(gè)數(shù)組,column是數(shù)組的當(dāng)前項(xiàng)(一個(gè)對(duì)象),column中有個(gè)屬性codeCamel,我想讓這個(gè)屬性的值作為v-model綁定的變量,因?yàn)槊總€(gè)對(duì)象中codeCamel對(duì)應(yīng)的值不一樣,求賜教啊,急急急!

回答
編輯回答
挽歌

codeCame是showColumns數(shù)組中的數(shù)據(jù),你可以通過(guò)修改showColumns數(shù)組來(lái)實(shí)現(xiàn)頁(yè)面重新渲染

2017年5月16日 10:13
編輯回答
筱饞貓

不是很理解你的問(wèn)題在哪,直接用v-model="column. codeCamel" 不行么?
你理解一下vue是數(shù)據(jù)驅(qū)動(dòng)的,
v-model綁定的是一個(gè)變量的名字,如column. codeCamel,那么 v-model的值就是所綁定的變量的值, 如username。
要理解vue需要把思想轉(zhuǎn)變過(guò)來(lái),不是像js那樣直接操作dom,vue是有一個(gè)綁定的關(guān)系,當(dāng)數(shù)據(jù)發(fā)生變化,該節(jié)點(diǎn)會(huì)自動(dòng)改變值

2018年5月23日 03:23
編輯回答
近義詞

重新編輯一下?;貜?fù)還回復(fù)不上了可還行。。。

第一點(diǎn):雙向綁定的含義是數(shù)據(jù)實(shí)體(js中的對(duì)象或者數(shù)組)的屬性值與視圖產(chǎn)生一個(gè)雙向的對(duì)應(yīng)關(guān)系。無(wú)論是數(shù)據(jù)實(shí)體屬性值的改變,還是視圖的值(input的value,select的value等)的改變,都會(huì)有相應(yīng)的體現(xiàn)。

第二點(diǎn):v-model指令,指明了當(dāng)前視圖元素應(yīng)當(dāng)與某個(gè)vue維護(hù)的數(shù)據(jù)實(shí)體中的某個(gè)屬性建立關(guān)系。v-model=‘column.codeCamel’表明了,這個(gè)input將于column這個(gè)對(duì)象中的codeCamel屬性建立關(guān)系。input的value=columen.codeCamel(這里默認(rèn)codeCamel屬性的類(lèi)型與input輸入類(lèi)型相同)

第三點(diǎn):你提到了你想讓input的值與username(?)進(jìn)行綁定。我們來(lái)討論一下數(shù)據(jù)實(shí)體的結(jié)構(gòu)。

let column = {
    ...
    codeCamel: "", // v-model=column.codeCamel
    ...
}

這種對(duì)象結(jié)構(gòu)顯然沒(méi)有你所說(shuō)的username

let column = {
    ...
    codeCamel: { // v-model=column.codeCamel.username
        username: '',
        pasword: '',
        email: ''
    },
    ...
}

這種結(jié)構(gòu)又不符合“codeCamel的值可能是username,password,email中的一種”

所以具體該怎么綁定,你只要弄清楚了codeCamel到底是什么,或者說(shuō)弄清楚column這個(gè)對(duì)象的定義結(jié)構(gòu)是什么,你自然就知道該怎么綁定了

2017年11月6日 00:52