关于如何支持其他组件库

[yyz945947732]

如果目前的权限组件无法满足你的需求，或者你希望你的权限组件是基于其他组件库，这些场景你都可以基于基础权限组件 Wrapper 等或工具方法 useAuthData 来轻易的封装你的权限组件。

例如你想封装一个基于 antd 的权限表格组件，你可以：

import { Table } from "antd";
import { useAuthData } from "@gzteacher/auth";

function AuthTable(props) {
  const { columns, ...otherProps } = props;
  const authedColumns = useAuthData(columns); // 对数据驱动的字段使用 useAuthData 过滤权限
  return <Table columns={authedColumns} {...otherProps} />;
}

这样便实现了一个基本的能过滤权限数据的表格组件。

[yyz945947732]

需要注意的是：

useAuthData 默认会对树形结构进行权限处理，children 字段会被当作默认子节点进行处理。如果你的数据不是树形结构，可以通过以下方式取消树形结构处理。

const authedData = useAuthData(data, { isTree: false });

如果你的数据需要处理树形结构，同时需要 children 字段渲染内容，那么你可以通过 childrenKey 指定子节点为其他字段。

const authedData = useAuthData(data, { isTree: true, childrenKey: "child" });