v1.0.7

新增自动换行+隐藏图标

docs/mds/XM22.md

@@ -0,0 +1,107 @@
+## 自动换行
+
+
+
+:::tip
+当需要选择很多选项时, 横向滚动满足不了你的需求, 可以开启自动换行
+:::
+
+
+### 开启换行
+
+:::demo `autoRow` = `true`
+```html
+<div id="demo1" class="xm-select-demo"></div>
+
+<script>
+var demo1 = xmSelect.render({
+    el: '#demo1', 
+    toolbar:{
+        show: true,
+    },
+    autoRow: true,
+    height: '500px',
+    data: [
+        {name: '张三1', value: 1, selected: true},
+        {name: '李四1', value: 2, selected: true},
+        {name: '王五1', value: 3, disabled: true},
+        {name: '苹果2', value: 4, selected: true, disabled: true},
+        {name: '香蕉2', value: 5, selected: true},
+        {name: '葡萄2', value: 6},
+    ]
+})
+</script>
+```
+:::
+
+
+### Layui风格
+
+前面的label居中 需要 **自行** 加一段css, 这里就没有内置到插件中了, 避免样式污染, 当前或许你有更好的css解决方案 ^_^
+```css
+.layui-form-pane .layui-form-label{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+```
+
+:::demo 
+```html
+<form class="layui-form layui-form-pane xm-select-demo ly-label-center" action="">
+    <div class="layui-form-item" pane>
+        <label class="layui-form-label">居中风格</label>
+        <div class="layui-input-block">
+            <div id="demo2"></div>
+        </div>
+    </div>
+</form>
+
+<form class="layui-form layui-form-pane xm-select-demo" action="">
+    <div class="layui-form-item" pane>
+        <label class="layui-form-label">默认风格</label>
+        <div class="layui-input-block">
+            <div id="demo3"></div>
+        </div>
+    </div>
+</form>
+
+<script>
+var demo2 = xmSelect.render({
+    el: '#demo2', 
+    toolbar:{
+        show: true,
+    },
+    filterable: true,
+    height: '500px',
+    autoRow: true,
+    data: [
+        {name: '张三1', value: 1, selected: true},
+        {name: '李四1', value: 2, selected: true},
+        {name: '王五1', value: 3, disabled: true},
+        {name: '苹果2', value: 4, selected: true, disabled: true},
+        {name: '香蕉2', value: 5, selected: true},
+        {name: '葡萄2', value: 6},
+    ]
+})
+
+var demo3 = xmSelect.render({
+    el: '#demo3', 
+    toolbar:{
+        show: true,
+    },
+    filterable: true,
+    height: '500px',
+    autoRow: true,
+    data: [
+        {name: '张三1', value: 1, selected: true},
+        {name: '李四1', value: 2, selected: true},
+        {name: '王五1', value: 3, disabled: true},
+        {name: '苹果2', value: 4, selected: true, disabled: true},
+        {name: '香蕉2', value: 5, selected: true},
+        {name: '葡萄2', value: 6},
+    ]
+})
+</script>
+```
+:::

docs/mds/XM23.md

@@ -0,0 +1,76 @@
+## 隐藏图标
+
+
+### 隐藏单选图标
+
+:::demo 
+```html
+<div id="demo1" class="xm-select-demo"></div>
+<div id="demo2" class="xm-select-demo"></div>
+
+<script>
+var demo1 = xmSelect.render({
+    el: '#demo1', 
+	radio: true,
+	clickClose: true,
+    model: {
+        icon: 'hidden',
+        label: {
+            type: 'text'
+        }
+    },
+    data: [
+        {name: '张三1', value: 1, selected: true},
+        {name: '李四1', value: 2},
+        {name: '王五1', value: 3, disabled: true},
+        {name: '苹果2', value: 4},
+    ]
+})
+
+var demo2 = xmSelect.render({
+    el: '#demo2', 
+	radio: true,
+	clickClose: true,
+    theme: {
+        color: '#5FB878',
+    },
+    model: {
+        icon: 'hidden',
+        label: {
+            type: 'text'
+        }
+    },
+    data: [
+        {name: '张三1', value: 1, selected: true},
+        {name: '李四1', value: 2},
+        {name: '王五1', value: 3, disabled: true},
+        {name: '苹果2', value: 4},
+    ]
+})
+</script>
+```
+:::
+
+
+### 隐藏多选图标
+
+:::demo 
+```html
+<div id="demo3" class="xm-select-demo"></div>
+
+<script>
+var demo3 = xmSelect.render({
+    el: '#demo3', 
+    model: {
+        icon: 'hidden',
+    },
+    data: [
+        {name: '张三1', value: 1, selected: true, disabled: true},
+        {name: '李四1', value: 2, selected: true},
+        {name: '王五1', value: 3, disabled: true},
+        {name: '苹果2', value: 4},
+    ]
+})
+</script>
+```
+:::

docs/mds/ZTEST.md

@@ -14,6 +14,10 @@ var demo1 = xmSelect.render({
         show: true
     },
     height: '500px',
+    model: {
+        icon: 'hidden',
+    },
+    autoRow: true,
     data: [
         {name: '城市', optgroup: true},
         {name: '北京13', value: 1},

docs/mds/options.md

@@ -37,6 +37,7 @@
 | name              | 表单提交时的name  |  string  |   -  |    select    |
 | toolbar           | 工具条, 具体看下表  |  object  |   -  |    -    |
 | showCount         | 展示在下拉框中的最多选项数量  |  int  |   -  |    0    |
+| autoRow           | 是否开启自动换行(选项过多时)  |  boolean  |   -  |    false    |
 
 
 ### prop
@@ -65,6 +66,8 @@
 
 ```
 model: {
+    //是否展示复选框或者单选框图标 show, hidden:变换背景色
+    icon: 'show',
     label: {
         //使用方式
         type: 'block',