0

我最近开始学习 React,我的组件中有一个数据网格,单击行时会触发一个事件。在事件处理程序中,我可以获取 Row 道具(单击的行的每一列的值)。所以我想要实现的是:我在表单组件上有 3 个按钮,这些按钮在网格中的行的单击上启用。我想导航到每个按钮的新页面 onClick,其中我将为网格中选择的行执行不同的操作。我面临的问题是,如何将 Row 道具传递给所有 3 个按钮的处理程序,因为我需要 Row 值来使用这些按钮执行不同的操作。

onRowclick = (row) =>

{
    this.context.route.push(`path\${row.ID}`);
}

onButton1click = (row) =>
{
    this.context.route.push(`path\${row.ID}`);
}
.
.
.
onButton3click = (row) =>
{
    this.context.route.push(`path\${row.ID}`);
}

我需要所有三个事件处理程序中的 row.ID,它们是否以某种方式将其存储在某种状态中,以便我能够在整个组件中使用它。?

更新:以下是实现此目的的代码

constructor(props) {
    super(props);
    this.state = this.getInitState(props);
    this.intitialize(); 
    }

  intitialize(){
      this.selectedRow = {};
  }

  getInitState(props) {
      return {selectedRow: undefined};
                  }
// on Row click storing the row object(which contains row data)
onRowClick = (row) => {

  this.selectedRow = row;

 }

非常基础的 React

4

1 回答 1

1

我认为是时候使用 REDUX 了。

Redux 是一个反应框架,用于在对象中存储状态。Redux 制作对象树,您可以使用 reducer 通过应用程序检索任何状态,并在 action 的帮助下存储状态。

Redux 有一个存储区,它存储应用程序的所有状态。

要了解有关 redux 的完整详细信息,请阅读以下内容:http ://redux.js.org/

于 2017-01-08T19:00:21.547 回答