当前位置: 首页 > 面试题库 >

我可以在React.js中更新组件的道具吗?

令狐经武
2023-03-14
问题内容

在开始使用React.js之后,似乎props是静态的(从父组件传入),而state基于事件的更改则似乎是静态的。但是,我在文档中注意到对的引用componentWillReceiveProps,其中具体包括以下示例:

componentWillReceiveProps: function(nextProps) {
  this.setState({
    likesIncreasing: nextProps.likeCount > this.props.likeCount
  });
}

这似乎意味着,性能可以改变根据的比较组件nextPropsthis.props。我想念什么?道具如何更改,或者我误认为道具的调用位置?


问题答案:

除非组件是数组或对象,否则组件不能更新其自身的props(即使可能,组件也要更新其自己的props是反模式),但是可以更新其状态和其子级的props。

例如,仪表板speed处于其状态的字段,并将其传递给显示该速度的Gauge子级。它的render方法是公正的return <Gauge speed={this.state.speed} />。仪表板调用时this.setState({speed: this.state.speed + 1}),将使用的新值重新渲染仪表speed

在此发生之前,componentWillReceiveProps就调用了量规,以便量规有机会将新值与旧值进行比较。



 类似资料:
  • 开始与React合作后。在js中,似乎是静态的(从父组件传入),而则根据事件进行更改。但是,我注意到文档中提到了,其中特别包括以下示例: 这似乎意味着,根据与。我错过了什么?道具是如何变化的,还是我弄错了它的名称?

  • 我想在Vue中创建自己的复选框。我想使用fontawesome中的两个图标(锁定和解锁)。选中“我的复选框”后,图标应锁定,否则将解锁。 这是我的代码: 我收到一个错误: 无法分配给“checked”,因为它是常量或只读属性 你能帮我解决这个问题吗?

  • 这是具有状态(值和项)的父组件。我试图将值状态作为道具传递给子组件。当我点击按钮时,在render方法中执行的代码正在执行切换。但当我调用componentDidMount中的list函数时,切换不起作用,但执行了click事件。 这是我的子组件,其中状态作为道具传递 我知道组件didmount只执行一次。但是除了在render方法中直接编写JSX之外,如何使它工作呢

  • 问题内容: 我已经在React中构建了一个组件,该组件应该在窗口滚动时更新其自身的样式以创建视差效果。 组件方法如下所示: 这是行不通的,因为React不知道组件已更改,因此该组件不会重新渲染。 我试过在组件状态下存储的值,并在滚动回调中调用。但是,这使滚动无法使用,因为这非常慢。 关于如何做到这一点的任何建议? 问题答案: 您应该在中绑定侦听器,这样,侦听器仅创建一次。您应该能够将样式存储在状态

  • 也许有一种方法可以将组件绑定到事件? 在使用React一年多后,在Sebastien Lorber的回答的激励下,我得出结论,将子组件作为参数传递给父母中的函数实际上不是React的方式,也不是一个好主意。我换了答案。