import React from "react";
import { Cascader, Form } from "@tencent/tea-component";

const data = [
  {
    label: "北京市",
    value: "bj",
    children: [
      { label: "朝阳区", value: "cy" },
      { label: "海淀区", value: "hd" },
    ],
  },
  {
    label: "上海市",
    value: "sh",
    children: [
      { label: "徐汇区", value: "xh" },
      { label: "黄埔区", value: "hp" },
    ],
  },
  {
    label: "广东省",
    value: "gd",
    children: [
      {
        label: "深圳市",
        value: "sz",
        children: [
          { label: "南山区", value: "ns" },
          { label: "宝安区", value: "ba" },
          { label: "福田区", value: "ft" },
        ],
      },
    ],
  },
];

export default function CascaderAllExample() {
  return (
    <Cascader
      all
      multiple
      clearable
      type="menu"
      data={data}
      onChange={(value, { options }) => console.log(value, options)}
    />
  );
}