react-antd-Dropdown动态展示问题

import React, { Fragment } from 'react';
import useTest from './useTest';
import CommonTable from './CommonTable';
function Test(){
const { authorization } = useTest(); //authorization 为bool值，判断是否有权限
const element=()=>{

}
return (
<CommonTable
operation={

{element()}

}
/>
)
}

export default Test;

element当中需要使用antd-Dropdown的下拉来做动态展示，类似下面的图面，但是只显示默认三个按钮，前两个按钮是操作，第三个按钮是下拉按钮（更多操作），用于展示其他操作，如果没有权限，就不展示，有权限就展示，如果只有两个操作有权限，那么只展示这两个操作按钮，不展示更多操作。

你想问按钮怎么显示与置灰？

需求描述的不清楚

那你就可以用自定义指令，全局根据权限判断按钮

import React, { Fragment } from 'react';
import useTest from './useTest';
import CommonTable from './CommonTable';
import {  Dropdown, Menu, Space } from "antd";

const menu = (
  <Menu
    items={[
      {
        key: "1",
        label: (
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="https://www.antgroup.com"
          >
            1st menu item
          </a>
        )
      },
      {
        key: "2",
        label: (
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="https://www.aliyun.com"
          >
            2nd menu item (disabled)
          </a>
        ),

        disabled: true
      },
      {
        key: "3",
        label: (
          <a
            target="_blank"
            rel="noopener noreferrer"
            href="https://www.luohanacademy.com"
          >
            3rd menu item (disabled)
          </a>
        ),
        disabled: true
      },
      {
        key: "4",
        danger: true,
        label: "a danger item"
      }
    ]}
  />
);



function Test(){
const { authorization } = useTest(); //authorization 为bool值，判断是否有权限
<div style={{ authorization : true?'block': "none" }}>
      <Dropdown overlay={menu}>
          <Space>Hover me</Space>
      </Dropdown>
    </div>

}

export default Test;