从组件外部设置React组件状态

Eldelshell

我有一个组件列表,想要在用户单击它时将每个组件设置为选中状态。

流看起来像

Dashboard
 ⎿ MyList
    ⎿ MyItem -> onClick -> setState({active:true})

我已经通过使用状态完成了选定的部分,但是我想知道如何停用所有其他元素。

温特维尔特

根据定义,无法从组件外部访问状态。并且不建议始终将道具复制到状态。

在您的组件树结构中。您应将所选项目设置为父项(而非项目)中的状态。

并将选定的ID作为道具传递给每个项目。

在子渲染中,您可以执行以下操作

let itemIsSelected = (this.props.itemId == this.props.selectedId);

并将方法从父级传递到子级,然后将其包括为:

onClick={() => this.props.setSelected(this.props.itemId)}

在官方文档中,对如何构造组件很好的解释这可能有助于确定某个东西应该是状态还是道具,或者是否可以在孩子或父母内部更好地管理东西。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

从组件外部设置React组件状态

来自分类Dev

React JS在功能组件中设置状态

来自分类Dev

在 React 中的特定组件上设置状态

来自分类Dev

更改React组件的状态

来自分类Dev

从旧的外部Java语言更改React组件的状态?

来自分类Dev

使用promise Hooks React JS跟踪组件外部状态的更新

来自分类Dev

如何访问组件外部的状态

来自分类Dev

如何在React的视频端设置组件的状态?

来自分类Dev

如何在React中轻松设置兄弟组件的状态?

来自分类Dev

嵌套子组件的React应用混乱设置状态

来自分类Dev

如何在React的视频端设置组件的状态?

来自分类Dev

React,在 promise 中设置组件状态时遇到问题

来自分类Dev

从另一个组件 React js 设置状态

来自分类Dev

无法设置反应组件的状态

来自分类Dev

无法在组件中设置状态

来自分类Dev

从卸载的组件设置父状态

来自分类Dev

如何设置子组件的子组件的父组件状态

来自分类Dev

React:获取父组件中子组件的状态

来自分类Dev

可以访问 React 组件状态的样式组件?

来自分类Dev

如何在React中从另一个组件设置一个组件的状态

来自分类Dev

在渲染下一个组件 React-Redux 之前设置组件的状态

来自分类Dev

在React中访问组件状态

来自分类Dev

更新React组件共享状态

来自分类Dev

React 通过组件提升状态

来自分类Dev

React,从组件中提取状态

来自分类Dev

如何从组件容器设置 React 组件的样式?

来自分类常见问题

从外部调用React组件方法

来自分类Dev

React Navigation:在组件外部导航

来自分类Dev

React.js-设置初始状态并定义在组件中利用该状态的道具