docs: add a demo for cascader load prop

Change-Id: Icbafbb8a80c64150c23292465278ba4b89713616

Author: xiaodemen

one/docs/components/cascader.md

@@ -45,6 +45,12 @@
 
 [[ demo src="/demo/cascader/value-display.vue" ]]
 
+### 数据项懒加载
+
+配合使用 [`load`](#props-load) 属性和数据项中 `lazy` 属性来实现数据懒加载。
+
+[[ demo src="/demo/cascader/lazy.vue" ]]
+
 ## API
 
 ### 属性
@@ -74,6 +80,7 @@
 | ``overlay-style`` | `string | Array | Object=` | - | 参考 [`Overlay`](./overlay) 组件的 [`overlay-style`](./overlay#props-overlay-style) 属性。 |
 | ``match`` | `(item, keyword, { ancestors }) => boolean | Array<[number, number]>` | - | 支持自定义高亮逻辑， 默认大小写不敏感，参考 [`Autocomplete`](./Autocomplete#自定义搜索逻辑)。 |
 | ``filter`` | `(item, keyword, { ancestors, offsets }) => boolean` | - | 支持自定义搜索命中逻辑，参考 [`Autocomplete`](./Autocomplete#自定义搜索逻辑)。 |
+| ``load`` | `Function` | - | [^load] |
 
 ^^^ui
 预设样式。
@@ -170,6 +177,26 @@
 +++
 ^^^
 
+^^^load
+
+数据项懒加载，配合数据项上 `lazy` 属性使用。
+
+```ts
+type Item {
+  label: string,
+  value: unknown,
+  options?: Array<Item>,
+  disabled?: boolean
+  lazy?: boolean
+}
+
+function load({
+  parent?: Item,
+  scope: 'descendants' | 'children'
+}): Item[] | void | Promise<Item[] | void>
+```
+^^^
+
 ### 插槽
 
 | 名称 | 描述 |

one/docs/demo/cascader/lazy.vue

@@ -0,0 +1,155 @@
+<template>
+<div>
+  <veui-cascader
+    v-model="value"
+    :options="options"
+    multiple
+    :load="load"
+  />
+</div>
+</template>
+
+<script>
+import { Cascader } from 'veui'
+
+const options = [
+  {
+    label: '浙江',
+    value: '浙江',
+    options: [
+      {
+        label: '威海',
+        value: '威海'
+      },
+      {
+        label: '滨州',
+        value: '滨州'
+      },
+      {
+        label: '临沂',
+        value: '临沂'
+      },
+      {
+        label: '东营',
+        value: '东营'
+      },
+      {
+        label: '济南',
+        value: '济南'
+      }
+    ]
+  },
+  {
+    label: '山东',
+    value: '山东',
+    lazy: true
+  },
+  {
+    label: '上海',
+    value: '上海',
+    disabled: true
+  },
+  {
+    label: '北京',
+    value: '北京'
+  },
+  {
+    label: '海外',
+    value: '海外',
+    disabled: true,
+    options: [
+      {
+        label: '日本',
+        value: '日本'
+      }
+    ]
+  }
+]
+
+const hzChildren = [
+  {
+    label: '菏',
+    value: '菏'
+  },
+  {
+    label: '泽',
+    value: '泽'
+  }
+]
+
+const getSdChildren = (full) => [
+  {
+    label: '菏泽',
+    value: '菏泽',
+    lazy: true,
+    ...(full ? { options: hzChildren } : null)
+  },
+  {
+    label: '潍坊',
+    value: '潍坊',
+    options: [
+      {
+        label: '潍',
+        value: '潍'
+      },
+      {
+        label: '坊',
+        value: '坊'
+      }
+    ]
+  },
+  {
+    label: '泰山',
+    value: '泰山',
+    // load no data
+    ...(full ? null : { lazy: true })
+  },
+  {
+    label: '烟台',
+    value: '烟台',
+    disabled: true
+  }
+]
+
+export default {
+  components: {
+    'veui-cascader': Cascader
+  },
+  data () {
+    return {
+      value: null,
+      options
+    }
+  },
+  methods: {
+    load: ({ parent, scope }) => {
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          let isFull
+          switch (scope) {
+            case 'children':
+              isFull = false
+              break
+            case 'descendants':
+              isFull = true
+              break
+            default:
+              console.warn('Not supported.')
+              resolve()
+              return
+          }
+
+          resolve(
+            parent
+              ? {
+                菏泽: hzChildren,
+                山东: getSdChildren(isFull)
+              }[parent.value]
+              : undefined
+          )
+        }, 1000)
+      })
+    }
+  }
+}
+</script>

package-lock.json

@@ -28,7 +28,7 @@
     "@vue/runtime-dom": "^3.2.31",
     "babel-eslint": "^10.1.0",
     "babel-plugin-lodash": "^3.3.4",
-    "babel-plugin-veui": "^2.7.2",
+    "babel-plugin-veui": "^2.7.3",
     "cheerio": "^1.0.0-rc.10",
     "dls-graphics": "^1.0.0-alpha.3",
     "dls-icons-vue": "^2.6.0",
@@ -88,10 +88,10 @@
     "typescript": "^4.6.2",
     "unist-util-remove": "^1.0.1",
     "unist-util-visit": "^1.4.0",
-    "veui": "^2.7.2",
-    "veui-loader": "^2.7.2",
-    "veui-theme-dls": "^2.7.2",
-    "veui-theme-dls-icons": "^2.7.2",
+    "veui": "^2.7.3",
+    "veui-loader": "^2.7.3",
+    "veui-theme-dls": "^2.7.3",
+    "veui-theme-dls-icons": "^2.7.3",
     "vue-awesome": "^4.5.0",
     "vue-frag": "^1.4.0",
     "vue-i18n": "^8.16.0",