状态在Angular应用程序中意味着什么? [英] What does a state mean in Angular application?

查看:77
本文介绍了状态在Angular应用程序中意味着什么?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是NgRx的新手,正在阅读其文档.但是,一开始我遇到以下句子:

I am new to NgRx and going through its documentation. But, at the beginning, I'm encountered with the following sentence:

状态是一个不变的数据结构.

State is a single, immutable data structure.

状态用简单的话是什么意思?需要一些简单的例子来理解这个概念.

What does the state mean in simple words? Need some simple examples to understand this concept.

我需要学习Flux和Redux才能理解这些概念吗?

Do I need to learn Flux and Redux to understand these concepts?

推荐答案

简单地说,ngrx(或redux或其他状态管理系统)中的状态是在单个时间点上描述系统的方式.

Simply put, a state in ngrx (or redux, or other state managment systems) is how your system is described in a single point in time.

您可以将其视为一个普通的javascript对象,它一次代表整个应用程序.让我们举一个todo s应用程序的简单示例,在这里我可以标记一个完成的项目(通过完成的标志)或选定的项目(通过索引).可能的状态可能看起来像这样:

You can think about it as a plain javascript object that represent your entire application at one point. Let's take a simple example of a todos app, where i can mark a completed item (by a completed flag) or selected item (by index). a possible state might look like this:

{
  items: [
    { text: 'Wash Car', completed: false},
    { text: 'Write Code', completed: true}
  ],
  selectedIndex: 0
}

如果我决定选择第二个索引,则我的未来状态将如下所示:

If I'll decide to select the second index, my state future state would look like this:

{
  items: [
    { text: 'Wash Car', completed: false},
    { text: 'Write Code', completed: true}
  ],
  selectedIndex: 1
}

因此,状态表示您在单个时间点内的应用逻辑.视图的实现取决于您-角度,反应和移动应用程序可以共享相同的状态并使用不同的视图层.

So, a state is a representation of your app logic in a single point of time. The view implementation is up to you - angular, react, and mobile application can share the same state and use different view layer.

某些状态管理系统要求状态为不可变,这意味着在todos示例我不会简单地更改状态,而是创建一个全新的状态来表示系统中的更改.

Some state-management system require the state to be immutable, meaning that in the todos example I wouldn't simply change my state, but rather create an entire new state to represent the change in the system.

多种原因,但是也许最明显的是,这种质量有助于Web系统识别状态的变化,并相应地更改视图.

There are multiple reasons for that, but maybe the most obvious one is that this quality help web systems to recognize changes in the state, and change the view accordingly.

NgRx是特定于角度的状态管理系统.如 NgRx 页中所述:

NgRx is an angular-specific state management system. as described in NgRx page:

NgRx Store为受Redux启发的Angular应用程序提供反应状态管理.

NgRx Store provides reactive state management for Angular apps inspired by Redux.

因此,一个很好的陈述就是学习redux(不变性的规则来自redux).您可以将NgRx看作基于RuxJS的基于Redux的状态管理.我建议拼命学习每个概念,然后再学习NgRx.

So, a good point to state would be to learn redux (The rule of immutability comes from redux). You can look at NgRx as a redux-based state management, power with RxJS. I would suggest to learn each concept desperately and then move to learn NgRx.

更新:这些问题可能有用

Update: These questions might be useful

  1. 为什么Redux中的对象不可变?
  2. Redux:为什么使用Object .assign,如果不执行深度克隆?
  1. Why should objects in Redux be immutable?
  2. Redux: why using Object.assign if it is not perform deep clone?

这篇关于状态在Angular应用程序中意味着什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆