From 2810d8c78d38e87b5d2bddca062bd5a92a7bf7e7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=A2=81=E7=81=8F?= <admin@aresn.com>
Date: Tue, 10 Jan 2017 19:29:59 +0800
Subject: [PATCH] fixed #183

fixed #183
---
 src/components/cascader/cascader.vue |  10 ++-
 test/routers/cascader.vue            | 126 +++++++++++++--------------
 test/routers/table.vue               | 112 +++++++++++++++---------
 3 files changed, 137 insertions(+), 111 deletions(-)

diff --git a/src/components/cascader/cascader.vue b/src/components/cascader/cascader.vue
index a27017cb..95285c96 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 9a289661..d73eb943 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 6139dadb..5ec55fb3 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 .table-name-col{
-        background: #2db7f5;
-    }
-    .ivu-table .table-address-col{
-        background: #187;
-    }
-    .ivu-table .class-cell-age{
-        background: #187;
+    .ivu-table .demo-table-info-row td{
+        background-color: #2db7f5;
         color: #fff;
     }
-    .ivu-table .class-cell-address{
-        background: #f60;
+    .ivu-table .demo-table-error-row td{
+        background-color: #ff6600;
         color: #fff;
     }
-    .ivu-table .class-cell-name{
-        background: #2db7f5;
+    .ivu-table .demo-table-info-column{
+        background-color: #2db7f5;
+        color: #fff;
+        border-bottom: 1px solid #2db7f5;
+    }
+    .ivu-table .demo-table-info-cell-name {
+        background-color: #2db7f5;
+        color: #fff;
+    }
+    .ivu-table .demo-table-info-cell-age {
+        background-color: #ff6600;
+        color: #fff;
+    }
+    .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,16 +80,42 @@
                     {
                         name: '李小红',
                         age: 30,
-                        address: '上海市浦东新区世纪大道',
-                        cellClassName: {
-                            name: 'class-cell-name'
-                        }
+                        address: '上海市浦东新区世纪大道'
                     },
                     {
                         name: '周小伟',
                         age: 26,
                         address: '深圳市南山区深南大道'
                     }
+                ],
+                data8: [
+                    {
+                        name: '王小明',
+                        age: 18,
+                        address: '北京市朝阳区芍药居'
+                    },
+                    {
+                        name: '张小刚',
+                        age: 25,
+                        address: '北京市海淀区西二旗',
+                        cellClassName: {
+                            age: 'demo-table-info-cell-age',
+                            address: 'demo-table-info-cell-address'
+                        }
+                    },
+                    {
+                        name: '李小红',
+                        age: 30,
+                        address: '上海市浦东新区世纪大道'
+                    },
+                    {
+                        name: '周小伟',
+                        age: 26,
+                        address: '深圳市南山区深南大道',
+                        cellClassName: {
+                            name: 'demo-table-info-cell-name'
+                        }
+                    }
                 ]
             }
         },