diff --git a/src/components/cascader/cascader.vue b/src/components/cascader/cascader.vue
index a27017c..95285c9 100644
--- a/src/components/cascader/cascader.vue
+++ b/src/components/cascader/cascader.vue
@@ -87,7 +87,8 @@
prefixCls: prefixCls,
visible: false,
selected: [],
- tmpSelected: []
+ tmpSelected: [],
+ updatingValue: false // to fix set value in changeOnSelect type
};
},
computed: {
@@ -162,6 +163,7 @@
});
if (!fromInit) {
+ this.updatingValue = true;
this.value = newVal;
this.emitValue(this.value, oldVal);
}
@@ -186,7 +188,11 @@
}
},
value () {
- this.updateSelected();
+ if (this.updatingValue) {
+ this.updatingValue = false;
+ return;
+ }
+ this.updateSelected(true);
}
}
};
diff --git a/test/routers/cascader.vue b/test/routers/cascader.vue
index 9a28966..d73eb94 100644
--- a/test/routers/cascader.vue
+++ b/test/routers/cascader.vue
@@ -1,80 +1,72 @@
<template>
- <div v-for="item in list">
- <Cascader :data="data" change-on-select :render-format="format"></Cascader>
- </div>
- <i-button @click="add">add</i-button>
- <i-button @click="remove">remove</i-button>
+ <Cascader :data="data" :value.sync="value" change-on-select></Cascader>
</template>
<script>
export default {
data () {
return {
- list: [
- {
- a: 1
- }
- ],
- data: [{
- value: 'beijing',
- label: '北京',
- children: [
- {
- value: 'gugong',
- label: '故宫'
- },
- {
- value: 'tiantan',
- label: '天坛'
- },
- {
- value: 'wangfujing',
- label: '王府井'
- }
- ]
- }, {
- value: 'jiangsu',
- label: '江苏',
- children: [
- {
- value: 'nanjing',
- label: '南京',
- children: [
- {
- value: 'fuzimiao',
- label: '夫子庙'
- }
- ]
- },
- {
- value: 'suzhou',
- label: '苏州',
- children: [
- {
- value: 'zhuozhengyuan',
- label: '拙政园'
- },
- {
- value: 'shizilin',
- label: '狮子林'
- }
- ]
- }
- ]
- }]
+ value: [],
+ data: []
}
},
methods: {
- add () {
- this.list.push({
- a: 2
- })
- },
- remove () {
- this.list.splice(0, 1);
- },
- format (labels) {
- return labels.join(' - ');
+ updateData () {
+ setTimeout(() => {
+ this.data = [{
+ value: 'beijing',
+ label: '北京',
+ children: [
+ {
+ value: 'gugong',
+ label: '故宫'
+ },
+ {
+ value: 'tiantan',
+ label: '天坛'
+ },
+ {
+ value: 'wangfujing',
+ label: '王府井'
+ }
+ ]
+ }, {
+ value: 'jiangsu',
+ label: '江苏',
+ children: [
+ {
+ value: 'nanjing',
+ label: '南京',
+ children: [
+ {
+ value: 'fuzimiao',
+ label: '夫子庙'
+ }
+ ]
+ },
+ {
+ value: 'suzhou',
+ label: '苏州',
+ children: [
+ {
+ value: 'zhuozhengyuan',
+ label: '拙政园'
+ },
+ {
+ value: 'shizilin',
+ label: '狮子林'
+ }
+ ]
+ }
+ ]
+ }];
+ setTimeout(() => {
+ this.value = ['beijing', 'tiantan'];
+ }, 1000);
+ }, 1000);
}
+ },
+ ready () {
+ this.updateData();
}
}
</script>
diff --git a/test/routers/table.vue b/test/routers/table.vue
index 6139dad..5ec55fb 100644
--- a/test/routers/table.vue
+++ b/test/routers/table.vue
@@ -1,36 +1,37 @@
<style>
- /*.ivu-table .demo-table-info-row td{*/
- /*background-color: #2db7f5;*/
- /*color: #fff;*/
- /*}*/
- /*.ivu-table .demo-table-error-row td{*/
- /*background-color: #ff6600;*/
- /*color: #fff;*/
- /*}*/
- .ivu-table .table-age-col{
- background: #ff6600;
+ .ivu-table .demo-table-info-row td{
+ background-color: #2db7f5;
+ color: #fff;
}
- .ivu-table .table-name-col{
- background: #2db7f5;
+ .ivu-table .demo-table-error-row td{
+ background-color: #ff6600;
+ color: #fff;
}
- .ivu-table .table-address-col{
- background: #187;
+ .ivu-table .demo-table-info-column{
+ background-color: #2db7f5;
+ color: #fff;
+ border-bottom: 1px solid #2db7f5;
}
- .ivu-table .class-cell-age{
- background: #187;
+ .ivu-table .demo-table-info-cell-name {
+ background-color: #2db7f5;
color: #fff;
}
- .ivu-table .class-cell-address{
- background: #f60;
+ .ivu-table .demo-table-info-cell-age {
+ background-color: #ff6600;
color: #fff;
}
- .ivu-table .class-cell-name{
- background: #2db7f5;
+ .ivu-table .demo-table-info-cell-address {
+ background-color: #187;
color: #fff;
}
</style>
<template>
+ <p>自定义行样式：</p>
<i-table :row-class-name="rowClassName" :columns="columns1" :data="data1"></i-table>
+ <p>自定义列样式：</p>
+ <i-table :columns="columns9" :data="data1"></i-table>
+ <p>自定义任意单元格样式：</p>
+ <i-table :columns="columns1" :data="data8"></i-table>
</template>
<script>
export default {
@@ -38,37 +39,38 @@
return {
columns1: [
{
- type: 'selection',
- width: 60,
- align: 'center'
+ title: '姓名',
+ key: 'name'
},
{
+ title: '年龄',
+ key: 'age'
+ },
+ {
+ title: '地址',
+ key: 'address'
+ }
+ ],
+ columns9: [
+ {
title: '姓名',
- key: 'name',
-// fixed: 'right',
-// className: 'table-name-col'
+ key: 'name'
},
{
title: '年龄',
key: 'age',
-// fixed: 'right',
-// className: 'table-age-col'
+ className: 'demo-table-info-column'
},
{
title: '地址',
- key: 'address',
-// className: 'table-address-col'
+ key: 'address'
}
],
data1: [
{
name: '王小明',
age: 18,
- address: '北京市朝阳区芍药居',
- cellClassName: {
- age: 'class-cell-age',
- address: 'class-cell-address'
- }
+ address: '北京市朝阳区芍药居'
},
{
name: '张小刚',
@@ -78,15 +80,41 @@
{
name: '李小红',
age: 30,
- address: '上海市浦东新区世纪大道',
+ address: '上海市浦东新区世纪大道'
+ },
+ {
+ name: '周小伟',
+ age: 26,
+ address: '深圳市南山区深南大道'
+ }
+ ],
+ data8: [
+ {
+ name: '王小明',
+ age: 18,
+ address: '北京市朝阳区芍药居'
+ },
+ {
+ name: '张小刚',
+ age: 25,
+ address: '北京市海淀区西二旗',
cellClassName: {
- name: 'class-cell-name'
+ age: 'demo-table-info-cell-age',
+ address: 'demo-table-info-cell-address'
}
},
{
+ name: '李小红',
+ age: 30,
+ address: '上海市浦东新区世纪大道'
+ },
+ {
name: '周小伟',
age: 26,
- address: '深圳市南山区深南大道'
+ address: '深圳市南山区深南大道',
+ cellClassName: {
+ name: 'demo-table-info-cell-name'
+ }
}
]
}
--
libgit2 0.21.4