Reactjs 从反应台上卸下按钮

我试图在我的应用程序中实现一个本质上是可折叠/可扩展的React表。 大概是这样的：

上述的代码是：

import React from 'react';
import ReactDOM from 'react-dom';
import 'antd/dist/antd.css';
import './index.css';
import { Table } from 'antd';

const columns = [
  { title: 'Name', dataIndex: 'name', key: 'name' },
  { title: 'Age', dataIndex: 'age', key: 'age' },
  { title: 'Address', dataIndex: 'address', key: 'address' },
  {
    title: 'Action',
    dataIndex: '',
    key: 'x',
    render: () => <a>Delete</a>,
  },
];

const data = [
  {
    key: 1,
    name: 'John Brown',
    age: 32,
    address: 'New York No. 1 Lake Park',
    description: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',
  },
  {
    key: 2,
    name: 'Jim Green',
    age: 42,
    address: 'London No. 1 Lake Park',
    description: 'My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park.',
  },
  {
    key: 3,
    name: 'Not Expandable',
    age: 29,
    address: 'Jiangsu No. 1 Lake Park',
    description: 'This not expandable',
  },
  {
    key: 4,
    name: 'Joe Black',
    age: 32,
    address: 'Sidney No. 1 Lake Park',
    description: 'My name is Joe Black, I am 32 years old, living in Sidney No. 1 Lake Park.',
  },
];

ReactDOM.render(
  <Table
    columns={columns}
    expandable={{
      expandedRowRender: record => <p style={{ margin: 0 }}>{record.description}</p>,
      rowExpandable: record => record.name !== 'Not Expandable',
    }}
    dataSource={data}
  />,
  document.getElementById('container'),
);

从“React”导入React；
从“react dom”导入react dom；
导入“antd/dist/antd.css”；
导入“./index.css”；
从“antd”导入{Table}；
常量列=[
{title:'Name'，dataIndex:'Name'，key:'Name'}，
{title:'Age'，dataIndex:'Age'，key:'Age'}，
{title:'Address'，dataIndex:'Address'，key:'Address'}，
{
标题：“行动”，
数据索引：“”，
键：“x”，
呈现：（）=>删除，
},
];
常数数据=[
{
重点:1,，
姓名：“约翰·布朗”，
年龄:32岁，
地址：“纽约第一湖公园”，
描述：“我叫约翰·布朗，今年32岁，住在纽约第一湖公园。”，
},
{
重点:二,，
姓名：“吉姆·格林”，
年龄:42,，
地址：“伦敦第一湖公园”，
描述：“我叫吉姆·格林，今年42岁，住在伦敦第一湖公园。”，
},
{
重点:三,，
名称：“不可扩展”，
年龄:29,，
地址：“江苏省第一湖滨公园”，
description:'这是不可扩展的'，
},
{
重点:四,，
姓名：“乔·布莱克”，
年龄:32岁，
地址：“悉尼第一湖公园”，
描述：“我叫乔·布莱克，今年32岁，住在悉尼第一湖公园。”，
},
];
ReactDOM.render(
{record.description}
,，
rowExpandable:record=>record.name！==“不可扩展”，
}}
数据源={data}
/>,
document.getElementById（'container'），
);

---

我想删除+按钮，使整行都可以点击。我怎样才能做到这一点呢？

阅读antd表的文档

请参阅道具。将

expandRowByClick

设置为true，并提供自定义

expandIcon

即空div

代码片段

(
{record.description}
),
rowExpandable:record=>record.name！==“不可扩展”，
expandIcon:（{expanded，onExpand，record}）=>
扩大？(
onExpand（记录，e）}/>
) : (
onExpand（记录，e）}/>
)
}}
数据源={data}
/>,

我可以删除空div吗？这样我就不会有额外的专栏了