下拉框里点击编辑图标出现输入框,但是点击输入框时,下拉框会自动关闭,如何不让下拉框自动关闭?
<el-select v-model="selectValue" ref="refSelect" placeholder="请选择" class="select" @visible-change="visibleChange" @change="selectChange" > <el-option v-for="item in tenderList" :key="item.value" :label="item.label" :value="item.value" @click.native="clickOption($event)" > <!-- @click.stop="handleItemClick(item)" --> <div v-if="item.flag" class="edit-input"> <!-- <div @click="doThisDom($event)"> --> <el-input v-model="item.label" placeholder="请输入" size="mini" @click.native.stop="inputFocus(item, $event)"></el-input> <!-- </div> --> <el-button type="text" size="small" @click.stop="editTender(item, $event)">确定</el-button> <el-button type="text" size="small" @click.stop="cancelEdit(item, $event)">取消</el-button> </div> <div v-else class="flex"> <span>{{ item.label }}</span> <span class="aciton"> <i class="el-icon-edit" @click="showEditTender(item, $event)"></i> <i class="el-icon-delete" @click="deleltTender(item.value, $event)"></i> </span> </div> </el-option> </el-select> // 下拉框数据: tenderList: [ { label: '选项一', value: 1, flag: false }, { label: '选项二', value: 2, flag: false }, { label: '选项三', value: 3, flag: false } ] // input框focus事件: inputFocus(e, event) { console.log('inputFocus', e) console.log(event) this.$refs.refSelect.focus() event.stopPropagation() }
标签:false,option,value,label,flag,下拉框,event,select From: https://www.cnblogs.com/lftBlogs/p/17539927.html