我在看Pluralsight关于React的课程,老师说道具不应该被改变。我现在正在读一篇关于道具vs.国家的文章(uberVU/react-guide),它说

道具和状态更改都会触发呈现更新。

文章后面说:

Props(属性的缩写)是组件的配置,如果可以的话,是它的选项。它们是从上面接收的,是不可变的。

所以道具可以改变,但它们应该是不可变的? 什么时候应该使用道具,什么时候应该使用状态? 如果你有一个React组件需要的数据,它应该通过道具或设置在React组件通过getInitialState?


当前回答

在React中,道具和状态之间有一些关键的区别。道具是不可变的——一旦设置好,就不能更改。另一方面,状态可以在任何时候改变。道具也从父组件传递给子组件,而状态是单个组件的局部状态。

其他回答

一般来说,一个组件(父组件)的状态是子组件的prop。

State resides within a component where as props are passed from parent to child. Props are generally immutable. class Parent extends React.Component { constructor() { super(); this.state = { name : "John", } } render() { return ( <Child name={this.state.name}> ) } } class Child extends React.Component { constructor() { super(); } render() { return( {this.props.name} ) } }

在上面的代码中,我们有一个父类(parent),它的状态是name,它被传递给子组件(子类)作为道具,子组件使用{this.props.name}渲染它。

我想用一种简单的方式向你解释状态和道具:

状态

我们使用状态来存储一些数据。它也像一个变量,当你改变它时,你的组件将再次呈现。

要使用状态,你需要导入useState钩子:

import { useState } from 'react';
const [state_name,function_name] = useState(initial_value);

您可以通过state_name访问您的状态,也可以通过function_name更改它并为其设置一个新值。

更多信息:https://reactjs.org/docs/state-and-lifecycle.html

道具

它是一种将数据从一个组件发送到另一个组件的机制。它看起来也像CSS中的属性。例如:

<Component props_value={custom_function} />

你可以发送一个自定义函数到组件,并接收它进行操作。

更多信息:https://reactjs.org/docs/components-and-props.html

“Props”是传递给组件(1)的外部输入,“state”是由组件(2)管理的内部私有数据。

道具——你不能改变它的值。 States—您可以在代码中更改它的值,但当呈现发生时它将是活动的。

State是你的数据,是可变的,你可以对它做任何你需要的事情,props是只读数据,通常当你传递props时,你已经使用了你的数据,你需要子组件来渲染它,或者如果你的props是一个函数,你调用它来执行任务