import React from "react";
import { Tree, Dropdown, List } from "@tencent/tea-component";

const data = [
  {
    id: "0-0",
    content: "0-0",
    operation: <Tree.Node.ActionLink>新增</Tree.Node.ActionLink>,
    children: [
      {
        id: "0-0-0",
        content: "0-0-0",
      },
    ],
  },
  {
    id: "0-1",
    content: "0-1",
    operation: (
      <Dropdown appearance="link" button="操作">
        <List type="option">
          <List.Item>操作一</List.Item>
          <List.Item>操作二</List.Item>
        </List>
      </Dropdown>
    ),
    children: [
      {
        id: "0-1-0",
        content: "0-1-0",
      },
      {
        id: "0-1-1",
        content: "0-1-1",
      },
    ],
  },
];

export default function TreeOperationExample() {
  return (
    <Tree
      data={data}
      selectable
      onSelect={(value, context) => {
        console.log(value, context);
      }}
    ></Tree>
  );
}