king-design-analyzer 2.1.7 → 2.2.0

package/components/cascader.json

@@ -1,373 +1,525 @@
 {
-  "id": "cascader",
-  "name": "Cascader",
-  "displayName": "级联选择",
-  "category": "form",
-  "description": "级联选择框。用于多层级数据的选择，如省市区选择、公司层级选择等。",
-  "importStatement": "import { Cascader } from '@king-design/vue';",
-  "props": [
-    {
-      "name": "value",
-      "description": "当前选中的值。多选模式下为数组。",
-      "type": {
-        "raw": "any",
-        "kind": "custom"
-      },
-      "required": false,
-      "default": "\"\"",
-      "usageExample": "<Cascader v-model=\"selectedCity\"></Cascader>"
-    },
-    {
-      "name": "data",
-      "description": "级联数据源。结构为 {value, label, children}[]",
-      "type": {
-        "raw": "CascaderData[]",
-        "kind": "array"
-      },
-      "required": true,
-      "default": "[]",
-      "usageExample": "<Cascader :data=\"options\"></Cascader>"
-    },
-    {
-      "name": "multiple",
-      "description": "是否开启多选模式",
-      "type": {
-        "raw": "boolean",
-        "kind": "boolean"
-      },
-      "required": false,
-      "default": "false",
-      "usageExample": "<Cascader multiple></Cascader>"
-    },
-    {
-      "name": "filterable",
-      "description": "是否可搜索",
-      "type": {
-        "raw": "boolean",
-        "kind": "boolean"
-      },
-      "required": false,
-      "default": "false",
-      "usageExample": "<Cascader filterable></Cascader>"
-    },
-    {
-      "name": "clearable",
-      "description": "是否显示清空按钮",
-      "type": {
-        "raw": "boolean",
-        "kind": "boolean"
-      },
-      "required": false,
-      "default": "false",
-      "usageExample": "<Cascader clearable></Cascader>"
-    },
-    {
-      "name": "disabled",
-      "description": "是否禁用",
-      "type": {
-        "raw": "boolean",
-        "kind": "boolean"
-      },
-      "required": false,
-      "default": "false",
-      "usageExample": "<Cascader disabled></Cascader>"
-    },
-    {
-      "name": "size",
-      "description": "尺寸",
-      "type": {
-        "raw": "\"large\" | \"default\" | \"small\" | \"mini\"",
-        "kind": "union",
-        "unionTypes": [
-          "large",
-          "default",
-          "small",
-          "mini"
-        ]
-      },
-      "required": false,
-      "default": "\"default\"",
-      "allowedValues": [
-        {
-          "value": "large",
-          "label": "大尺寸"
-        },
-        {
-          "value": "default",
-          "label": "默认尺寸",
-          "isDefault": true
-        },
-        {
-          "value": "small",
-          "label": "小尺寸"
-        },
-        {
-          "value": "mini",
-          "label": "迷你尺寸"
+    "id": "cascader",
+    "name": "Cascader",
+    "displayName": "级联选择",
+    "category": "form",
+    "description": "级联选择框。用于多层级数据的选择，如省市区选择、公司层级选择等。",
+    "importStatement": "import { Cascader } from '@king-design/vue';",
+    "props": [
+        {
+            "name": "value",
+            "description": "当前选中的值。多选模式下为数组。",
+            "type": {
+                "raw": "any",
+                "kind": "custom"
+            },
+            "required": false,
+            "default": "\"\"",
+            "usageExample": "<Cascader v-model=\"selectedCity\">"
+        },
+        {
+            "name": "data",
+            "description": "级联数据源。结构为 {value, label, children}[]",
+            "type": {
+                "raw": "CascaderData[]",
+                "kind": "array"
+            },
+            "required": true,
+            "default": "[]",
+            "usageExample": "<Cascader :data=\"options\">"
+        },
+        {
+            "name": "multiple",
+            "description": "是否开启多选模式",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader multiple>"
+        },
+        {
+            "name": "filterable",
+            "description": "是否可搜索",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader filterable>"
+        },
+        {
+            "name": "filter",
+            "description": "自定义筛选规则函数",
+            "type": {
+                "raw": "(keywords: string, data: CascaderData) => boolean",
+                "kind": "function",
+                "functionSignature": "(keywords: string, data: CascaderData) => boolean"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Cascader filterable :filter=\"(kw, item) => item.label.includes(kw)\">"
+        },
+        {
+            "name": "clearable",
+            "description": "是否显示清空按钮",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader clearable>"
+        },
+        {
+            "name": "disabled",
+            "description": "是否禁用",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader disabled>"
+        },
+        {
+            "name": "name",
+            "description": "表单元素的 name 属性",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Cascader name=\"city\">"
+        },
+        {
+            "name": "size",
+            "description": "尺寸",
+            "type": {
+                "raw": "\"large\" | \"default\" | \"small\" | \"mini\"",
+                "kind": "union",
+                "unionTypes": [
+                    "large",
+                    "default",
+                    "small",
+                    "mini"
+                ]
+            },
+            "required": false,
+            "default": "\"default\"",
+            "allowedValues": [
+                {
+                    "value": "large",
+                    "label": "大尺寸"
+                },
+                {
+                    "value": "default",
+                    "label": "默认尺寸",
+                    "isDefault": true
+                },
+                {
+                    "value": "small",
+                    "label": "小尺寸"
+                },
+                {
+                    "value": "mini",
+                    "label": "迷你尺寸"
+                }
+            ],
+            "usageExample": "<Cascader size=\"small\">"
+        },
+        {
+            "name": "hideIcon",
+            "description": "是否隐藏后面的下拉图标",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader hideIcon>"
+        },
+        {
+            "name": "trigger",
+            "description": "子菜单触发方式",
+            "type": {
+                "raw": "\"click\" | \"hover\"",
+                "kind": "union",
+                "unionTypes": [
+                    "click",
+                    "hover"
+                ]
+            },
+            "required": false,
+            "default": "\"click\"",
+            "allowedValues": [
+                {
+                    "value": "click",
+                    "label": "点击触发",
+                    "isDefault": true
+                },
+                {
+                    "value": "hover",
+                    "label": "悬停触发"
+                }
+            ],
+            "usageExample": "<Cascader trigger=\"hover\">"
+        },
+        {
+            "name": "changeOnSelect",
+            "description": "是否选中父级即改变 value（允许选择任意一级）",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader changeOnSelect>"
+        },
+        {
+            "name": "format",
+            "description": "自定义选中项的显示格式，参数为选中的数据项数组，返回显示的字符串。",
+            "type": {
+                "raw": "(values: any[]) => string",
+                "kind": "function"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Cascader :format=\"(v) => v.map(i => i.label).join(' > ')\">"
+        },
+        {
+            "name": "loadData",
+            "description": "动态加载数据函数。当子节点为空时调用。",
+            "type": {
+                "raw": "(item: any) => Promise<void> | void",
+                "kind": "function"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Cascader :loadData=\"loadMore\">"
+        },
+        {
+            "name": "loading",
+            "description": "是否显示加载中状态",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader loading>"
+        },
+        {
+            "name": "fluid",
+            "description": "是否宽度 100%",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader fluid>"
+        },
+        {
+            "name": "inline",
+            "description": "展示内联模式，该模式下组件没有边框，宽度和高度由内容撑开",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader inline>"
+        },
+        {
+            "name": "placeholder",
+            "description": "占位文本",
+            "type": {
+                "raw": "string",
+                "kind": "string"
+            },
+            "required": false,
+            "default": "\"请选择\"",
+            "usageExample": "<Cascader placeholder=\"请选择城市\">"
+        },
+        {
+            "name": "container",
+            "description": "指定弹出菜单追加的位置，默认 Dialog 组件会追加到 Dialog 中，其他追加到 body",
+            "type": {
+                "raw": "string | ((parentDom: Element, anchor: Node | null) => Element)",
+                "kind": "union"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Cascader :container=\"() => document.body\">"
+        },
+        {
+            "name": "width",
+            "description": "指定宽度，组件自动添加单位 px",
+            "type": {
+                "raw": "number | string",
+                "kind": "union"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Cascader :width=\"240\">"
+        },
+        {
+            "name": "show",
+            "description": "是否展示菜单项（受控模式）",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader :show=\"visible\">"
+        },
+        {
+            "name": "position",
+            "description": "菜单弹出的位置",
+            "type": {
+                "raw": "Position | \"left\" | \"bottom\" | \"right\" | \"top\"",
+                "kind": "union",
+                "unionTypes": [
+                    "left",
+                    "bottom",
+                    "right",
+                    "top"
+                ]
+            },
+            "required": false,
+            "default": "{my: 'left top+8', at: 'left bottom'}",
+            "usageExample": "<Cascader position=\"top\">"
+        },
+        {
+            "name": "flat",
+            "description": "是否展示扁平样式",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader flat>"
+        },
+        {
+            "name": "nowrap",
+            "description": "选中值区域是否不换行展示，适合单行紧凑布局",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader nowrap>"
+        },
+        {
+            "name": "draggable",
+            "description": "多选值是否支持拖动排序",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader multiple draggable>"
+        },
+        {
+            "name": "virtual",
+            "description": "是否开启虚拟列表，用于大数据量场景",
+            "type": {
+                "raw": "boolean",
+                "kind": "boolean"
+            },
+            "required": false,
+            "default": "false",
+            "usageExample": "<Cascader virtual>"
+        },
+        {
+            "name": "fields",
+            "description": "自定义字段名映射，默认 {value:'value', label:'label', children:'children', disabled:'disabled'}",
+            "type": {
+                "raw": "object",
+                "kind": "custom"
+            },
+            "required": false,
+            "default": "undefined",
+            "usageExample": "<Cascader :fields=\"{value: 'code', label: 'name'}\">"
+        }
+    ],
+    "events": [
+        {
+            "name": "change",
+            "description": "值发生变化时触发",
+            "params": [
+                {
+                    "name": "value",
+                    "type": "any",
+                    "description": "当前选中的值"
+                }
+            ],
+            "usageExample": "<Cascader @change=\"handleChange\">"
+        },
+        {
+            "name": "show",
+            "description": "菜单显示时触发",
+            "params": [],
+            "usageExample": "<Cascader @show=\"onShow\">"
+        },
+        {
+            "name": "hide",
+            "description": "菜单隐藏时触发",
+            "params": [],
+            "usageExample": "<Cascader @hide=\"onHide\">"
+        }
+    ],
+    "methods": [
+        {
+            "name": "show",
+            "description": "主动展开级联选择面板。",
+            "params": [],
+            "returnType": "void",
+            "usageExample": "cascaderRef.value?.show();"
+        },
+        {
+            "name": "hide",
+            "description": "主动关闭级联选择面板。",
+            "params": [],
+            "returnType": "void",
+            "usageExample": "cascaderRef.value?.hide();"
+        },
+        {
+            "name": "position",
+            "description": "重新计算级联选择面板的位置。",
+            "params": [],
+            "returnType": "void",
+            "usageExample": "cascaderRef.value?.position();"
         }
-      ],
-      "usageExample": "<Cascader size=\"small\"></Cascader>"
-    },
-    {
-      "name": "trigger",
-      "description": "子菜单触发方式",
-      "type": {
-        "raw": "\"click\" | \"hover\"",
-        "kind": "union",
-        "unionTypes": [
-          "click",
-          "hover"
-        ]
-      },
-      "required": false,
-      "default": "\"click\"",
-      "allowedValues": [
-        {
-          "value": "click",
-          "label": "点击触发",
-          "isDefault": true
-        },
-        {
-          "value": "hover",
-          "label": "悬停触发"
+    ],
+    "typeDefinitions": [
+        {
+            "name": "CascaderData",
+            "definition": "interface CascaderData {\n  value: string | number;\n  label: string;\n  children?: CascaderData[];\n  disabled?: boolean;\n  loaded?: boolean;\n  [key: string]: any;\n}",
+            "description": "级联选择器数据项结构"
         }
-      ],
-      "usageExample": "<Cascader trigger=\"hover\"></Cascader>"
-    },
-    {
-      "name": "changeOnSelect",
-      "description": "是否选中父级即改变 value（允许选择任意一级）",
-      "type": {
-        "raw": "boolean",
-        "kind": "boolean"
-      },
-      "required": false,
-      "default": "false",
-      "usageExample": "<Cascader changeOnSelect></Cascader>"
-    },
-    {
-      "name": "format",
-      "description": "自定义选中项的显示格式，参数为选中的数据项数组，返回显示的字符串。",
-      "type": {
-        "raw": "(values: any[]) => string",
-        "kind": "function"
-      },
-      "required": false,
-      "default": "undefined",
-      "usageExample": "<Cascader :format=\"(v) => v.map(i => i.label).join(' > ')\"></Cascader>"
-    },
-    {
-      "name": "loadData",
-      "description": "动态加载数据函数。当子节点为空时调用。",
-      "type": {
-        "raw": "(item: any) => Promise<void> | void",
-        "kind": "function"
-      },
-      "required": false,
-      "default": "undefined",
-      "usageExample": "<Cascader :loadData=\"loadMore\"></Cascader>"
-    },
-    {
-      "name": "loading",
-      "description": "是否显示加载中状态",
-      "type": {
-        "raw": "boolean",
-        "kind": "boolean"
-      },
-      "required": false,
-      "default": "false",
-      "usageExample": "<Cascader loading></Cascader>"
-    },
-    {
-      "name": "placeholder",
-      "description": "占位文本",
-      "type": {
-        "raw": "string",
-        "kind": "string"
-      },
-      "required": false,
-      "default": "\"请选择\"",
-      "usageExample": "<Cascader placeholder=\"请选择城市\"></Cascader>"
-    },
-    {
-      "name": "fields",
-      "description": "自定义字段名映射，默认 {value:'value', label:'label', children:'children', disabled:'disabled'}",
-      "type": {
-        "raw": "object",
-        "kind": "custom"
-      },
-      "required": false,
-      "default": "undefined",
-      "usageExample": "<Cascader :fields=\"{value: 'code', label: 'name'}\"></Cascader>"
-    }
-  ],
-  "events": [
-    {
-      "name": "change",
-      "description": "值发生变化时触发",
-      "params": [
-        {
-          "name": "value",
-          "type": "any",
-          "description": "当前选中的值"
+    ],
+    "examples": [
+        {
+            "id": "cascader_basic",
+            "title": "基础用法",
+            "description": "省市区级联选择",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Cascader } from '@king-design/vue';\n\nconst value = ref([]);\nconst options = [\n  {\n    value: 'zhejiang',\n    label: 'Zhejiang',\n    children: [\n      {\n        value: 'hangzhou',\n        label: 'Hangzhou',\n        children: [\n          {\n            value: 'xihu',\n            label: 'West Lake',\n          },\n        ],\n      },\n    ],\n  },\n  {\n    value: 'jiangsu',\n    label: 'Jiangsu',\n    children: [\n      {\n        value: 'nanjing',\n        label: 'Nanjing',\n        children: [\n          {\n            value: 'zhonghuamen',\n            label: 'Zhong Hua Men',\n          },\n        ],\n      },\n    ],\n  },\n];\n</script>\n<template>\n  <Cascader v-model=\"value\" :data=\"options\" />\n</template>",
+            "tags": [
+                "basic",
+                "select"
+            ],
+            "usedProps": [
+                "data",
+                "value"
+            ],
+            "usedEvents": [],
+            "usedSlots": [],
+            "usedMethods": [],
+            "scenario": "选择地理位置"
+        },
+        {
+            "id": "cascader_display_input",
+            "title": "显示在输入框",
+            "description": "显示完整的选择路径",
+            "difficulty": "easy",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Cascader } from '@king-design/vue';\n\nconst value = ref([]);\nconst options = [{ value: 'bj', label: 'Beijing', children: [{ value: 'hd', label: 'Haidian' }] }];\n</script>\n<template>\n  <Cascader v-model=\"value\" :data=\"options\" placeholder=\"请选择\" />\n</template>",
+            "tags": [
+                "input",
+                "placeholder"
+            ],
+            "usedProps": [
+                "placeholder"
+            ],
+            "usedEvents": [],
+            "usedSlots": [],
+            "usedMethods": [],
+            "scenario": "表单中的级联选择"
+        },
+        {
+            "id": "cascader_change_on_select",
+            "title": "选择即改变",
+            "description": "允许选择任意一级菜单",
+            "difficulty": "medium",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Cascader } from '@king-design/vue';\n\nconst value = ref([]);\nconst options = [{ value: 'bj', label: 'Beijing', children: [{ value: 'hd', label: 'Haidian' }] }];\n</script>\n<template>\n  <Cascader v-model=\"value\" :data=\"options\" changeOnSelect />\n</template>",
+            "tags": [
+                "flexible",
+                "changeOnSelect"
+            ],
+            "usedProps": [
+                "changeOnSelect"
+            ],
+            "usedEvents": [],
+            "usedSlots": [],
+            "usedMethods": [],
+            "scenario": "可以只选择省份，也可以选择到城市"
+        },
+        {
+            "id": "cascader_multiple",
+            "title": "多选模式",
+            "description": "支持多选",
+            "difficulty": "medium",
+            "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Cascader } from '@king-design/vue';\n\nconst value = ref([]);\nconst options = [\n  { value: '1', label: 'Option 1', children: [{ value: '1-1', label: 'Option 1-1' }] },\n  { value: '2', label: 'Option 2', children: [{ value: '2-1', label: 'Option 2-1' }] }\n];\n</script>\n<template>\n  <Cascader v-model=\"value\" :data=\"options\" multiple />\n</template>",
+            "tags": [
+                "multiple",
+                "select"
+            ],
+            "usedProps": [
+                "multiple"
+            ],
+            "usedEvents": [],
+            "usedSlots": [],
+            "usedMethods": [],
+            "scenario": "多选分类标签"
+        }
+    ],
+    "commonMistakes": [
+        {
+            "id": "cascader_data_empty",
+            "description": "数据未加载时显示空白",
+            "wrongCode": "<Cascader :data=\"[]\" />",
+            "correctCode": "<Cascader :data=\"options\" :loading=\"isLoading\" />",
+            "explanation": "如果数据为空，建议设置 loading 状态或者提供数据源。",
+            "relatedProps": [
+                "data",
+                "loading"
+            ]
+        },
+        {
+            "id": "cascader_value_array",
+            "description": "value 格式错误",
+            "wrongCode": "const value = ref('beijing')",
+            "correctCode": "const value = ref(['beijing', 'chaoyang'])",
+            "explanation": "Cascader 的 value 通常是一个数组（表示路径），如果是多选则为二维数组。",
+            "relatedProps": [
+                "value"
+            ]
         }
-      ],
-      "usageExample": "<Cascader @change=\"handleChange\"></Cascader>"
-    },
-    {
-      "name": "show",
-      "description": "菜单显示时触发",
-      "params": [],
-      "usageExample": "<Cascader @show=\"onShow\"></Cascader>"
-    },
-    {
-      "name": "hide",
-      "description": "菜单隐藏时触发",
-      "params": [],
-      "usageExample": "<Cascader @hide=\"onHide\"></Cascader>"
-    }
-  ],
-  "slots": [
-    {
-      "name": "value",
-      "description": "自定义选择结果的展示",
-      "params": "([value: any, label: Children]) => Children"
-    },
-    {
-      "name": "values",
-      "description": "自定义多选的选择结果的展示",
-      "params": "([values: any[], labels: Children[]]) => Children"
-    },
-    {
-      "name": "prefix",
-      "description": "自定义输入框前面展示的内容"
-    },
-    {
-      "name": "suffix",
-      "description": "自定义输入框后面展示的内容"
-    }
-  ],
-  "methods": [],
-  "typeDefinitions": [
-    {
-      "name": "CascaderData",
-      "definition": "interface CascaderData {\n  value: string | number;\n  label: string;\n  children?: CascaderData[];\n  disabled?: boolean;\n  loaded?: boolean;\n  [key: string]: any;\n}",
-      "description": "级联选择器数据项结构"
-    }
-  ],
-  "examples": [
-    {
-      "id": "cascader_basic",
-      "title": "基础用法",
-      "description": "省市区级联选择",
-      "difficulty": "easy",
-      "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Cascader } from '@king-design/vue';\n\nconst value = ref([]);\nconst options = [\n  {\n    value: 'zhejiang',\n    label: 'Zhejiang',\n    children: [\n      {\n        value: 'hangzhou',\n        label: 'Hangzhou',\n        children: [\n          {\n            value: 'xihu',\n            label: 'West Lake',\n          },\n        ],\n      },\n    ],\n  },\n  {\n    value: 'jiangsu',\n    label: 'Jiangsu',\n    children: [\n      {\n        value: 'nanjing',\n        label: 'Nanjing',\n        children: [\n          {\n            value: 'zhonghuamen',\n            label: 'Zhong Hua Men',\n          },\n        ],\n      },\n    ],\n  },\n];\n</script>\n<template>\n  <Cascader v-model=\"value\" :data=\"options\" />\n</template>",
-      "tags": [
-        "basic",
-        "select"
-      ],
-      "usedProps": [
-        "data",
-        "value"
-      ],
-      "usedEvents": [],
-      "usedSlots": [],
-      "usedMethods": [],
-      "scenario": "选择地理位置"
-    },
-    {
-      "id": "cascader_display_input",
-      "title": "显示在输入框",
-      "description": "显示完整的选择路径",
-      "difficulty": "easy",
-      "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Cascader } from '@king-design/vue';\n\nconst value = ref([]);\nconst options = [{ value: 'bj', label: 'Beijing', children: [{ value: 'hd', label: 'Haidian' }] }];\n</script>\n<template>\n  <Cascader v-model=\"value\" :data=\"options\" placeholder=\"请选择\" />\n</template>",
-      "tags": [
-        "input",
-        "placeholder"
-      ],
-      "usedProps": [
-        "placeholder"
-      ],
-      "usedEvents": [],
-      "usedSlots": [],
-      "usedMethods": [],
-      "scenario": "表单中的级联选择"
-    },
-    {
-      "id": "cascader_change_on_select",
-      "title": "选择即改变",
-      "description": "允许选择任意一级菜单",
-      "difficulty": "medium",
-      "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Cascader } from '@king-design/vue';\n\nconst value = ref([]);\nconst options = [{ value: 'bj', label: 'Beijing', children: [{ value: 'hd', label: 'Haidian' }] }];\n</script>\n<template>\n  <Cascader v-model=\"value\" :data=\"options\" changeOnSelect />\n</template>",
-      "tags": [
-        "flexible",
-        "changeOnSelect"
-      ],
-      "usedProps": [
-        "changeOnSelect"
-      ],
-      "usedEvents": [],
-      "usedSlots": [],
-      "usedMethods": [],
-      "scenario": "可以只选择省份，也可以选择到城市"
-    },
-    {
-      "id": "cascader_multiple",
-      "title": "多选模式",
-      "description": "支持多选",
-      "difficulty": "medium",
-      "code": "<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport { Cascader } from '@king-design/vue';\n\nconst value = ref([]);\nconst options = [\n  { value: '1', label: 'Option 1', children: [{ value: '1-1', label: 'Option 1-1' }] },\n  { value: '2', label: 'Option 2', children: [{ value: '2-1', label: 'Option 2-1' }] }\n];\n</script>\n<template>\n  <Cascader v-model=\"value\" :data=\"options\" multiple />\n</template>",
-      "tags": [
-        "multiple",
-        "select"
-      ],
-      "usedProps": [
-        "multiple"
-      ],
-      "usedEvents": [],
-      "usedSlots": [],
-      "usedMethods": [],
-      "scenario": "多选分类标签"
-    }
-  ],
-  "commonMistakes": [
-    {
-      "id": "cascader_data_empty",
-      "description": "数据未加载时显示空白",
-      "wrongCode": "<Cascader :data=\"[]\" />",
-      "correctCode": "<Cascader :data=\"options\" :loading=\"isLoading\" />",
-      "explanation": "如果数据为空，建议设置 loading 状态或者提供数据源。",
-      "relatedProps": [
-        "data",
-        "loading"
-      ]
-    },
-    {
-      "id": "cascader_value_array",
-      "description": "value 格式错误",
-      "wrongCode": "const value = ref('beijing')",
-      "correctCode": "const value = ref(['beijing', 'chaoyang'])",
-      "explanation": "Cascader 的 value 通常是一个数组（表示路径），如果是多选则为二维数组。",
-      "relatedProps": [
-        "value"
-      ]
-    }
-  ],
-  "searchKeywords": [
-    "级联选择",
-    "cascader",
-    "select",
-    "tree",
-    "多级联动",
-    "省市区"
-  ],
-  "useCases": [
-    "省市区地址选择",
-    "公司组织架构选择",
-    "多级商品分类选择"
-  ],
-  "relatedComponents": [
-    "Select",
-    "TreeSelect"
-  ]
+    ],
+    "searchKeywords": [
+        "级联选择",
+        "cascader",
+        "select",
+        "tree",
+        "多级联动",
+        "省市区"
+    ],
+    "useCases": [
+        "省市区地址选择",
+        "公司组织架构选择",
+        "多级商品分类选择"
+    ],
+    "relatedComponents": [
+        "Select",
+        "TreeSelect"
+    ]
 }