始于Layui, 下拉選擇框的多選解決方案
下載地址: https://gitee.com/maplemei/xm-select
文檔地址: https://maplemei.gitee.io/xm-select/
使用方式
//第一步, 下載, 然后引入xm-select.js
<script src="dist/xm-select.js" type="text/javascript" charset="utf-8"></script>
//第二步, 頁面寫一個占位標(biāo)簽
<div id="demo1"></div>
//第三步, 去渲染這個標(biāo)簽
var demo1 = xmSelect.render({
el: '#demo1',
data: [
{name: '水果', value: 1, selected: true, disabled: true},
{name: '蔬菜', value: 2, selected: true},
{name: '桌子', value: 3, disabled: true},
{name: '北京', value: 4},
],
})
一個小栗子
回顯方式
- 對象中加上
selected: true
即可 - 使用
setValue
方法
demo1.setValue([
{name: '蔬菜', value: 2, selected: true},
{name: '北京', value: 4, selected: true},
])
- 用
update
方法更新data數(shù)據(jù)
//這種方式會更新整個數(shù)據(jù)
demo1.update({
data: [
{name: '蔬菜', value: 2, selected: true},
{name: '北京', value: 4, selected: true},
]
})
當(dāng)然, 更多的問題就去看看文檔吧~~