您现在的位置是：网站首页> 编程资料编程资料

element-ui+vue-treeselect下拉框的校验过程_vue.js_

2023-05-24 312人已围观

简介 element-ui+vue-treeselect下拉框的校验过程_vue.js_

element-ui+vue-treeselect下拉框的校验(ivew也适用)

在项目开发中使用了vue-treeselect的话，使用element-ui或者ivew自带的表单校验发现，trigger中blur和change均不生效，在选择了值之后验证依然存在

解决方法主要是使用vue-treeselect官网中api给出的事件中的input，在value改变后触发，将trigger设为blur

以下代码示例为ivew UI

vue-treeselect的插件使用

vue-treeselect地址：https://www.vue-treeselect.cn/

使用@select监听树形下拉选中事件：

在methods里定义函数接收参数node和instanceId

methods: { //选中树形部门选项 departTreeSelected(node,instanceId){ let url = '/datas/staff/busiselect?departCode=' + node.code; let _this = this; this.$http.get(url).then(res => { if(res.data.code==0){ var datas = res.data.data; for(let item in datas) { //出差申请人数组 _this.staffArr.push({ value: item, label: datas[item].match(/(\S*)-/)[1] //截取'-'前面内容作为人员姓名 }) //职级数组 _this.rankArr.push({ value: item, rank: datas[item].match(/-(\S*)/)[1] //截取'-'后面内容作为职级id }) } } }) .catch(err => { return err; }); }, }

以上为个人经验，希望能给大家一个参考，也希望大家多多支持。

您可能感兴趣的文章:

上一篇：关于下拉类型多选组件Vue-Treeselect(键名转换)_vue.js_

下一篇：Nodejs环境Eggjs加签验签示例代码_node.js_

您现在的位置是：网站首页> 编程资料编程资料

element-ui+vue-treeselect下拉框的校验过程_vue.js_

目录

element-ui+vue-treeselect下拉框的校验(ivew也适用)

vue-treeselect的插件使用

相关内容

点击排行

本栏推荐

猜你喜欢