上集回顾: 增加了按下tab键跳过button的功能( 原理是对应的标签上加上 tabindex="-1" )
问题: el-input el-button都没问题,到了el-checkbox这里,发现没有效果。
思路: 去页面实验后发现,是在el-checkbox里面的input 还是会停下,并且相关的span 获得了 is-focus。但如果给这个input设置了tabindex=‘-1‘ 就没问题了。
’所以我要给el-checkbox里面的input增加。
我的checkbox增加的条件是遍历timeBox的数组增加。所以是用watch监听timeBoxList。若长度增加。则用ref+dom增加tabindex属性。
注意,一定要用$nextTick
Vue 实现响应式并不是数据发生变化之后 DOM 立即变化,而是按一定的策略进行 DOM 的更新。
$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调,在修改数据之后使用 $nextTick,则可以在回调中获取更新后的 DOM。