v1.1.0.Beta+

docs/mds/XM15.md

@@ -1,7 +1,7 @@
 ## 构建选项
 
 
-### 默认渲染
+### 自定义渲染
 
 :::demo 
 ```html
@@ -10,10 +10,16 @@
 <script>
 var demo1 = xmSelect.render({
 	el: '#demo1', 
-	data: [
-		{name: '张三', value: 'zhangsan', selected: true},
-		{name: '李四', value: 'lisi', selected: true},
-		{name: '王五', value: 'wangwu'},
+	template({ item, sels, name, value }){
+		return item.name  + '<span style="position: absolute; right: 10px; color: #8799a3">'+value+'</span>' 
+	},
+	prop: {
+		name: 'showname',
+	},
+	data: [
+		{name: '张三', value: 'zhangsan', showname: '组织部-张三', selected: true},
+		{name: '李四', value: 'lisi', showname: '策划部-李四', selected: true},
+		{name: '王五', value: 'wangwu', showname: '运营部-王五' },
 	]
 })
 </script>
@@ -21,24 +27,35 @@ var demo1 = xmSelect.render({
 :::
 
 
-### 自定义渲染
+### 自定义渲染 - label
 
 :::demo 
 ```html
 <div id="demo2" class="xm-select-demo"></div>
 
-<script>
+<script>
+var icons = ['layui-icon layui-icon-face-smile', 'layui-icon layui-icon-cellphone']
+
 var demo2 = xmSelect.render({
 	el: '#demo2', 
-	template({ item, sels, name, value }){
-		return name  + '<span style="position: absolute; right: 10px; color: #8799a3">'+value+'</span>' 
-	},
-	data: [
-		{name: '张三', value: 'zhangsan', selected: true},
-		{name: '李四', value: 'lisi', selected: true},
-		{name: '王五', value: 'wangwu'},
+	model: {
+		label: {
+			block: {
+				template: function(item, sels){
+					return '<i class="'+icons[item.group]+'"></i>' + item.name;
+				},
+			},
+		}
+	},
+	template({ item, sels, name, value }){
+		return item.name  + '<span style="position: absolute; right: 10px; color: #8799a3">'+value+'</span>' 
+	},
+	data: [
+		{group: 1, name: '张三', value: 'zhangsan', selected: true},
+		{group: 0, name: '李四', value: 'lisi', selected: true},
+		{group: 1, name: '王五', value: 'wangwu' },
 	]
 })
 </script>
 ```
-:::
+:::

docs/mds/ZP02.md

@@ -16,6 +16,8 @@ tree: {
 	indent: 20,
 	//默认展开节点的数组
 	expandedKeys: [],
+	//是否严格遵守父子模式
+	strict: true,
 },
 ```
 
@@ -29,6 +31,7 @@ tree: {
 <div class="layui-form">
 	<input type="checkbox" name="showFolderIcon" lay-filter="showFolderIcon" lay-skin="primary" title="是否展示三角图标" checked>
 	<input type="checkbox" name="showLine" lay-filter="showLine" lay-skin="primary" title="是否显示虚线" checked>
+	<input type="checkbox" name="strict" lay-filter="strict" lay-skin="primary" title="严格父子结构" checked>
 </div>
 
 <div style="margin-top: 20px">间距</div>
@@ -38,20 +41,16 @@ tree: {
 <script>
 layui.form.render();
 
-layui.form.on('checkbox(showFolderIcon)', function(data){
-	demo1.update({
-		tree: {
-			showFolderIcon: data.elem.checked
-		}
-	})
-});
-layui.form.on('checkbox(showLine)', function(data){
-	demo1.update({
-		tree: {
-			showLine: data.elem.checked
-		}
-	})
-});
+['showFolderIcon', 'showLine', 'strict'].forEach(function(key){
+	layui.form.on('checkbox('+key+')', function(data){
+		var treeConfig = {};
+		treeConfig[key] = data.elem.checked;
+		demo1.update({
+			tree: treeConfig
+		})
+	});
+})
+
 layui.slider.render({
 	elem: '#slideTest1',
 	min: 10,

docs/mds/options.md

@@ -115,7 +115,9 @@ model: {
 			//最大显示数量, 0:不限制
 			showCount: 0,
 			//是否显示删除图标
-			showIcon: true,
+			showIcon: true,
+			//自定义渲染label, 默认渲染name, 回调参数(item, sels)
+			template: null,
 		},
 		//自定义文字
 		count: {
@@ -170,6 +172,7 @@ list: [ "ALL", "CLEAR",
 | showLine	 | 是否显示虚线 | boolean	 |	true / false	|	true   |
 | indent	   | 间距	 | int	   |	-   |   20 |
 | expandedKeys | 默认展开的节点数组	 | array	   |	-	|   [ ] |
+| strict | 是否遵循严格父子结构	 | boolean	 |	true / false	|	true   |
 
 
 ### 全局方法