反应道具状态和Redux

时间:2016-04-18 18:03:34

标签: reactjs properties components state redux

  • 州与道具有什么不同?
  • 如果我们有CompomentA例如ComponentB接受输入,那么你怎么能把ComponentA的值传递给ComponentB,然后CompomentContainer输出(到如果我们有一个名为6的第三个组件,它是A和B的容器,那么在屏幕上打印相同的值吗?
  • 什么是Redux?主网站上redux的定义对我来说没有意义。它是如何工作的?如何做出反应?

请耐心等待,我希望我的问题有道理。谢谢。

2 个答案:

答案 0 :(得分:4)

这些是非常有效的问题。我一直在那里,我知道阅读有关减少而不理解任何东西是多么令人沮丧。出于某种原因,人们喜欢使用花哨的单词,这听起来很复杂但实际上事情非常简单和容易。

什么是Redux? Redux是一个Flux架构。简单来说,它将帮助您管理应用程序的全局状态。

它是如何运作的? Redux将创建一个" store",这个商店将包含您需要在组件中呈现的所有数据,您可以使用" actions"来更新数据,您将调用这些操作从您的组件中,这些操作会将新数据传输到减速器内部,在减速器内部,您基本上将数据从组件复制到全局状态(Reducer应该是纯函数)。

如何做出反应? 它非常有用!主要是因为您将能够跨组件共享数据。此外,通过拥有全局状态,您可以将其保存到本地存储(或数据库)以添加脱机支持。

州与道具有什么不同? 您可以定义道具来描述组件在创建实例时将接收的属性,您可以将道具视为参数,例如:

<MyComponent name="Crysfel" lastname="Villa" />

上一个组件正在接收两个道具,名称和姓氏。假设ComponentB是ComponentA的子代,则Props将允许您将ComponentA中的数据发送到ComponentB。道具还可以帮助您从redux接收数据。根据经验,你永远不应该修改道具的价值,这些价值只是为了接收数据。

状态另一方面是一个可能包含组件配置的对象,其思想是处理组件的状态,例如可折叠容器,您可以在组件的状态中具有切换属性并在用户单击按钮时切换值。但是,使用redux时,很少会使用组件的状态,因为Redux正在管理应用程序的状态。

关于在组件之间发送数据的第二个问题,你可以使用redux,ComponentA应该调用一个动作并将新数据发送到全局状态,然后redux将使用新数据更新你的组件然后你可以渲染将新数据导入ComponentB(使用道具)。

答案 1 :(得分:0)

州与道具有什么不同?

State是直接绑定到设置它的React组件的数据。 Props是从父组件传递到子组件的数据。与国家不同,道具是不可改变的,永远不会设置&#34;直接

如果我们有例如ComponentA接受输入然后ComponentB输出(在屏幕上打印它)相同的值,你怎么能传递一个值让我们说CompomentA到ComponentB如果我们有一个名为CompomentContainer的第三个组件,它是A和B的容器?

要将值从组件A传递到ComponentB,您将提供值props,通过ComponentA渲染函数传入。像这样:

class ComponentA extends React.component {
  render() {
    return <ComponentB myvalue={value} />
  }
}

在ComponentB中,可以访问该值:this.props.myvalue

什么是Redux?主网站上redux的定义对我来说没有意义。它是如何工作的?如何做出反应?

Redux是Flux的一个实现,具有一些架构差异。您可以将其视为一个库,帮助您创建一个将数据单向传递到React组件的中央数据存储。它允许您在组件本身之外维护全局状态。

顶级容器组件通常会监听商店并在商店数据发生更改时重新呈现(请参阅connect函数)。然后,数据从容器组件传递到需要该数据的子组件,以便它们可以正确呈现。