fixed Cascader bug

梁灏
1 parent eaf51d3e
Showing 2 changed files with 55 additions and 52 deletions Show diff stats
examples/routers/cascader.vue
src/components/cascader/caspanel.vue
 <template>
-    <div style="margin: 100px;width: 200px;">
-        <Cascader :data="data" v-model="value1" change-on-select></Cascader>
-    </div>
+    <Cascader :data="data4" :load-data="loadData"></Cascader>
 </template>
 <script>
     export default {
         data () {
             return {
-                value1: [],
-                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: '狮子林',
-                                }
-                            ]
-                        }
-                    ],
-                }]
+                data4: [
+                    {
+                        value: 'beijing',
+                        label: '北京',
+                        children: [],
+                        loading: false
+                    },
+                    {
+                        value: 'hangzhou',
+                        label: '杭州',
+                        children: [],
+                        loading:false
+                    }
+                ]
+            }
+        },
+        methods: {
+            loadData (item, callback) {
+                item.loading = true;
+                setTimeout(() => {
+                    console.log(1)
+                    if (item.value === 'beijing') {
+                        item.children = [
+//                            {
+//                                value: 'talkingdata',
+//                                label: 'TalkingData'
+//                            },
+//                            {
+//                                value: 'baidu',
+//                                label: '百度'
+//                            },
+//                            {
+//                                value: 'sina',
+//                                label: '新浪'
+//                            }
+                        ];
+                    } else if (item.value === 'hangzhou') {
+                        item.children = [
+                            {
+                                value: 'ali',
+                                label: '阿里巴巴'
+                            },
+                            {
+                                value: '163',
+                                label: '网易'
+                            }
+                        ];
+                    }
+                    item.loading = false;
+                    callback();
+                }, 1000);
             }
         }
     }
@@ -67,7 +67,9 @@
                             if (fromUser) {
                                 cascader.isLoadedChildren = true;
                             }
-                            this.handleTriggerItem(item);
+                            if (item.children.length) {
+                                this.handleTriggerItem(item);
+                            }
                         });
                         return;
                     }