1鲫咽、問題出現(xiàn)
我用v-for循環(huán),里面包括a-input節(jié)點(diǎn),但每次按輸入或者刪除鍵分尸,都會失去焦點(diǎn)锦聊,不能連貫輸入就很懊惱!箩绍!
2孔庭、問題猜想
可能是因?yàn)榇a中哪里觸發(fā)了render,使組件進(jìn)行重新渲染伶选,所以輸入框自然就失去了焦點(diǎn)史飞。
3尖昏、解決方法
最終還是代碼問題仰税,v-for循環(huán)里的 key 值是包括a-input的輸入的內(nèi)容,每輸入一個字符抽诉,key就會改變陨簇,引發(fā)render重新渲染。
<span v-for="(key, value) in entity_item"
:key="key"
v-show="value === columns_item.model" >
<a-input v-model="entity_item[columns_item.model]" />
</span>
只要把key變成常量就可以了
<span v-for="(key, value) in entity_item"
:key="value"
v-show="value === columns_item.model" >
<a-input v-model="entity_item[columns_item.model]" />
</span>
4迹淌、結(jié)論
寫代碼要注意:v-for的key是否是可改變的河绽,并且該key值與你所輸入的控件綁定或會被該控件間接影響。