当前位置:网站首页>El cascade and El select click elsewhere to make the drop-down box disappear

El cascade and El select click elsewhere to make the drop-down box disappear

2022-04-23 17:03:00 Eli-sun

el-cascader:
You can give el-cascader Bind one @blur event
And then execute this.$refs.area.dropDownVisible = false This statement

<el-cascader
            ref="area"
            v-model="addForm.idList"
            :props="defaultParams"
            :options="treeList"
            clearable
            @change="handleChange"
            @blur="close(1)"
          />

close(val) {
      if (val === 1) {
        this.$refs.area.dropDownVisible = false
      } else if (val === 2) {
        this.$refs.fixarea.dropDownVisible = false
      }
    },

el-select:
The same is true for binding a @blur event
Then execute this statement

<el-select
            ref="fixdataDirect"
            v-model="fixForm.dataDirect"
            placeholder=" Please select data flow direction "
            @blur="close(2)"
          >
            <el-option
              v-for="item in dataList"
              :key="item.id"
              :label="item.label"
              :value="item.value"
            />
          </el-select>

close(val) {
      if (val === 1) {
        this.$refs.dataDirect.blur()
      } else if (val === 2) {
        this.$refs.fixdataDirect.blur()
      }
    },

版权声明
本文为[Eli-sun]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/04/202204230554290264.html