problem description
in Table component column render has a Dropdown component, which is composed of several buttons under
Dropdown component. The official example given by
is to render the a tag to the row directly, so that you can get the data directly.
but I want to get the data of the current line when I click the button in the drop-down menu of a row for other operations.
I tried to extract the Dropdown component to encapsulate a separate Operation component, which can achieve the problem of passing values, but is there a more concise way not to re-wrap the layer?
as shown in the following figure: the action column is a drop-down menu with an execute button below,
Name
the example is here: https://codesandbox.io/s/nr5q.
in the example, the method I use is as follows:
columns = [
{
title: "Name",
dataIndex: "name",
key: "name",
render: text => <a href="javascript：;">{text}</a>
},
{
align: "center",
title: "",
dataIndex: "name",
key: "operation",
render: text => {
// rendertextOperationtext
return <Operation text={text} handleShowModal={this.showModal} />;
}