(nuxt.js)点击指定地方使指定输入框自动获取焦点
1.代码图片
2.示例代码
<!-- 刻字效果 start -->
<div class="EngravingModule" v-if="item.lettering">
<div class="seal">
<div class="buycort_Lettering">
<!-- ref="container" -->
<div class="inputBox" ref="container">
<span class="txt" v-if="!(showSealBox && showBox && selectIndex == index && toggle) " @click.stop="showInput(item, index, 'madeUpBLetter')">{{item.lettering}}</span>
<input ref="container" v-focus v-if="showSealBox && showBox && selectIndex == index && toggle" id="input" :class="{'input-width': language == 'zh_CN'}" v-model="lettering" type="text" :placeholder="lang.placeHold">
<div>
<em ref="container" class="em1" v-for="(a,index) in content" :key="index" @click="choose('input',a)">{{a}}</em>
</div>
</div>
<i class="looktokz" @click.stop="confirmAttr()" :class="{'i-padding':language == 'en_US'}">{{lang.confirmBtn}}</i>
</div>
</div>
</div>
<!-- 刻字效果 end -->
3.点击事件代码关键
4.自定义指令(与mounted同级位置处)
directives: {
focus: {
//指令的定义
inserted: function (el){
el.focus()
}
}
},
5.data里声明变量