有没有办法让'expandRowByClick‘只在我点击Ant Design中行的某一部分时才可执行？

import { Table } from 'antd';

const columns = [
  {
    title: 'Name',
    dataIndex: 'name',
    render: (text, record) => (
      <div>
        <span>{record.name}</span>
        <span onClick={() => handleExpand(record.id)}>Expand</span>
      </div>
    ),
  },
  // other columns
];

const handleExpand = (id) => {
  // 执行展开或折叠操作
};

const data = [
  {
    key: '1',
    name: 'John Brown',
    age: 32,
    address: 'New York No. 1 Lake Park',
  },
  // other data
];

const App = () => (
  <Table
    columns={columns}
    dataSource={data}
    expandable={{ expandRowByClick: false }}
  />
);

export default App;

import { Table } from 'antd';
import { PlusOutlined, MinusOutlined } from '@ant-design/icons';

const columns = [
  {
    title: 'Name',
    dataIndex: 'name',
  },
  // other columns
];

const expandedRowRender = (record) => {
  // 展开行的内容
};

const expandIcon = ({ expanded, onExpand, record }) => (
  <span onClick={() => handleExpand(record.id)}>
    {expanded ? <MinusOutlined /> : <PlusOutlined />}
  </span>
);

const handleExpand = (id) => {
  // 执行展开或折叠操作
};

const data = [
  {
    key: '1',
    name: 'John Brown',
    age: 32,
    address: 'New York No. 1 Lake Park',
  },
  // other data
];

const App = () => (
  <Table
    columns={columns}
    dataSource={data}
    expandable={{ expandedRowRender, expandIcon }}
  />
);

export default App;