iview 级联选择组件_iView Cascader级联选择器

使用iView的Cascader级联选择器时，遇到了change-on-select相关问题。

当然Cascader是动态方式加载选项的。

change-on-select: true，初始值只能设置第一级

废话不多说，上栗子iView Cascader change-on-select为true问题，当然在实际应用中，肯定是有设置初始值的情况的，所以需要找到相关解决方案。

官网注解：change-on-select 当此项为 true 时，点选每级菜单选项值都会发生变化

change-on-select: false，可以设置初始值

既然change-on-select为true时有问题，那么change-on-select设置为false呢？

iView Cascader change-on-select为false问题

初始值可以设置了，很棒，有个缺点就是无法点击菜单选项，值就直接生效。

如果既想设置初始值，又想每次点击菜单选项值都发生变化呢？有没有解决方案？！

当然，是有的。

既设置初始值，又能够点击菜单选项值发生变化

怎么做呢？

答：动态的更改change-on-select咯，且通过on-visible-change事件。iView Cascader 既能设置初始值，又能点击菜单选项值变化

on-visible-change 展开和关闭弹窗时触发显示状态，Boolean

:change-on-select="changeOnSelect"

@on-visible-change="handleChangeOnSelect">

/**

* 动态设置change-on-select的值

* 当级联选择器弹窗展开时，设置change-on-select为true，即可以点选菜单选项值发生变化

* 当级联选择器弹窗关闭时，设置change-on-select为false，即能够设置初始值

handleChangeOnSelect (value) {

this.changeOnSelect = value

}

(完)

iview 级联选择组件_iView Cascader级联选择器相关推荐

iview 级联选择组件_使用 element-ui 级联插件遇到的坑
需求描述[省市区三级联动] 组件:Cascader 级联选择器后端需要所选中的地区的名字,如:['北京市', '北京市', '东城区'] 获取后端省市区具体列表的接口返回数据: // 省 - 参数1 ...
android 级联选择组件 CascadePickerView
CascadePickerView 级联选择组件,包括基础组件和城市选择组件目前公开的记录组件基本都有限制,限制选择级别,如很多城市组件只能选择三级:省.市.县本组件不限制级别,可无极显示,只要按 ...
html5地区级联选择,【JS】vue+vant移动端地区级联选择组件
首页专栏 javascript 文章详情 0 vue+vant移动端地区级联选择组件 quanta发布于今天 08:25 写在开头:项目的框架是vue+vant,业务需求一个级联的地区选择,写完才 ...
iview 级联选择组件_vue组件递归渲染实例
文章选自我的语雀专栏<不造点轮子你可能都不知道的前端技巧>, 如果你喜欢的话可以关注我的语雀专栏https://www.yuque.com/u548790/technique,或者关注我的 ...
iview级联选择组件的动态加载数据的使用与编辑回显
感慨就不多说了,心声万千,上代码. 1.页面组件,动态加载需要loadData,iview官网有写 <Cascader :data="treeData" :load-data ...
iview 级联选择组件_Vue组件库大对比--HeyUI, iView, Element
目前,市面上主流的Vue组件库大概就是iview, element. 当然,heyui不在范围内,38个star屈指可数,大部分还是认识的同事. 更可恶的还是骗不来后端同学的star,心塞. 求Sta ...
iview 级联选择组件_iviewui级联选择如何自定义?
export default { data () { return { value2: ['jiangsu', 'suzhou', 'zhuozhengyuan'], data: [{ value: ...
级联选择组件_如何开发一个 Antd 级联多选控件
本文也同步发在掘金上, https:// juejin.cn/post/69149942 41940750343 Intro 这篇文章将从零开始介绍如何开发一个 Antd 的级联多选选择器.先看效果: ...
html5地区级联选择,js 省地市级联选择
demo1为最简单的一份实现,页面id配置需在js文件中写入,适合简单情况 demo2增加了动态配置,可将配置项传入,适合页面存在多个级联下拉以下为地市数据json格式,可使用ajax获取或者做成a ...
Vue+element ui表单中省市区级联选择—v-distpicker/Cascader
v-distpicker组件或Cascader 级联选择器 1.页面 <el-form ref="form" :model="form" :rules=& ...

iview 级联选择组件_iView Cascader级联选择器

iview 级联选择组件_iView Cascader级联选择器相关推荐

最新文章

热门文章