元素聚焦
其實(shí)聚焦本質(zhì)上還是調(diào)用js的原生方法focus()霹娄，也就是說(shuō)如果你想要某個(gè)DOM節(jié)點(diǎn)聚焦娩贷，只需要它調(diào)用這個(gè)方法就可以
需求
當(dāng)彈窗打開時(shí)管跺，自動(dòng)聚焦到input輸入框锭亏。
看似很簡(jiǎn)單咖城，但是有兩個(gè)容易出問(wèn)題的地方：
一族檬、聚焦的時(shí)機(jī)
當(dāng)彈窗的開關(guān)變量為true時(shí)歪赢，你讓相應(yīng)的元素聚焦，但此時(shí)可能彈窗并沒(méi)有渲染完成
二单料、聚焦的元素
當(dāng)你使用第三方組件的Input輸入框時(shí)埋凯，你為這個(gè)輸入框標(biāo)記了ref，但是獲取到的是這個(gè)組件扫尖，而并不是組件中的input
而你使用原生的input元素則不會(huì)有這個(gè)問(wèn)題
代碼
iView彈窗和輸入框
<Modal v-model="modalFocus">
<Input type="text" ref="inputFocus" :autofocus="true" v-model="inputValue" ></Input>
</Modal>
data () {
return {
modalFocus: false,
inputValue: '',
}
},
watch: {
modalFocus (val) {
if (val) {
this.$nextTick(() => {
this.$refs.inputFocus.$el.children[1].focus()
})
}
},
},
