el-input 获取焦点
el-input 当值为 0 时 显示无限大
<template>
<div>
<div @click="addItem"> + </div>
<div v-for="(item,index) in list">
{{item.flag}}
<div v-if="!item.flag" @click="showItemInput(item,index)">无限大</div>
<el-input :ref="'input_'+index" v-show="item.flag" @blur="item.flag = false;$forceUpdate()" v-model="item.inputValue" placeholder="请输入内容"></el-input>
</div>
</div>
</template>
<script>
export default {
name: "inputDemo",
data() {
return {
inputValue: '',
flag: false,
list: [
{
flag: false,
inputValue: ''
},
{
flag: false,
inputValue: ''
}
]
}
},
methods:{
showInput(){
this.flag = true;
this.$nextTick(() => {
console.log(this.$refs['input'])
this.$refs['input'].$refs.input.focus();
})
this.$forceUpdate();
},
showItemInput(item,index){
item.flag = true;
this.$nextTick(() => {
console.log(this.$refs['input_'+index])
this.$refs['input_'+index][0].focus();
})
this.$forceUpdate();
},
addItem(){
this.list.push({
flag: false,
inputValue: ''
})
}
}
}
</script>
<style scoped>
</style>