React-admin:在react.component中无法访问的权限

// admin.js
import { Admin, Resource } from 'react-admin';
import { UserList, UserEdit, UserShow } from './users';

const App = () => (
  <Admin authProvider={authProvider}>
    <Resource name="users" list={UserList} edit={UserEdit} show={UserShow} />
  </Admin>
);

// authProvider.js
export const authProvider = {
  login: ({ username, password }) => {
    // 实现登录逻辑，返回用户信息和权限
  },
  checkError: ({ status }) => {
    // 根据HTTP状态码处理错误
  },
  checkAuth: () => {
    // 检查用户是否已认证并获取权限
  },
  logout: () => {
    // 实现登出逻辑
  },
};

import { usePermissions } from 'react-admin';

const MyComponent = () => {
  const { permissions } = usePermissions();

  if (!permissions.canEdit) {
    return <div>You do not have permission to edit.</div>;
  }

  return (
    <div>
      <button>Edit</button>
    </div>
  );
};

import { useEffect } from 'react';
import { usePermissions } from 'react-admin';

const MyComponent = () => {
  const { permissions, setPermissions } = usePermissions();

  useEffect(() => {
    // 监听权限变化并更新
    const checkPermissions = async () => {
      const newPermissions = await fetchPermissions();
      setPermissions(newPermissions);
    };

    checkPermissions();
  }, [setPermissions]);

  return (
    <div>
      {permissions.canEdit ? <button>Edit</button> : <div>No permission</div>}
    </div>
  );
};