2017-07-06 284 views
2

我在想最近学习reactjs,希望有人能帮助我理解使用redux的情况,因为我对它的复杂逻辑感到困惑。使用redux有什么好处?

首先,我已经使用了angular2 +一段时间了,所以我也试图从我已经知道的东西中获得这个想法。

我见过很多redux的例子,但我不明白使用动作和分派的好处。

使用redux商店使用动作和缩减器而不是像这样使用类和主题有什么好处?

class Store{ 
    subject = new BehaviorSubject(0); 
    get value(){ 
     return this.subject.getValue(); 
    } 
    inc(){ 
     this.subject.next(this.subject.value+1); 
    } 
    dec(){ 
     this.subject.next(this.subject.value-1); 
    } 
    clear(){ 
     this.subject.next(0); 
    } 
} 

class Demo extends React.Component<{}, {}>{ 
    store = new Store(); 
    componentWillMount(){ 
     this.store.subject.subscribe(_ => this.forceUpdate()) 
    } 
    render(){ 
     const value = this.store.value; 
     const { inc, dec, clear } = this.store; 
     const store = this.store; 
     return (
      <div> 
       <span>{`current value is ${value}`}</span> 
       <button onClick={inc.bind(store)}>INC</button> 
       <button onClick={dec.bind(store)}>DEC</button> 
       <button onClick={clear.bind(store)}>CLEAR</button> 
      </div> 
     ); 
    } 
} 
+0

您是否得出结论,特别是关于Angular与Smart/DumbComponents或Services一起使用?据我了解,redux但Angular的好处可以做到这一点。我没有看到这一点,也许你现在知道更好.. – hogan

+0

我认为至少对于一个个人项目来说,redux的好处是微乎其微的。我相信这对调试有用,但除此之外,我认为这对于涉及少数人的项目来说是一种矫枉过正。 – darwinsenior

回答

1

调度比传统方法调用操作的好处:

  1. 记录,因为所有的动作可以很容易地记录下来,你总能看到发生了什么事情的应用程序。对于那些对我来说是杀手级功能的大型应用程序。

  2. 预处理 - 您可以使用redux中间件对您的操作进行各种花哨的预处理 - 最典型的是以某种方式自动执行xhr请求。

  3. 由于动作是可序列化的,因此实现诸如“撤消”之类的功能要容易得多,但这并不经常需要。

关于redurs-redurs碰巧是更新不可变状态的最简洁方法。因此,减速器与可变与不可变的商店状态无关,这是一个相当虔诚的问题。我会说,给定足够的纪律可变状态以及不变的状态。


关于预处理,基本上你可以有一段代码看起来对系统中所有发生的事情,做的东西,如果一个动作符合某些标准的行动。

例如:它们具有{ url, params }属性将导致成由{ url }指定的后端API的请求并转换成新的行动这将具有代替URL &的{ responseJson }属性

  • 所有动作params
  • 所有包含{ debounce }属性的操作都会被消除,所以如果您连续发出一打这样的动作,只有最后一个动作会被实际处理。
  • 所有具有{ alert }属性的动作都会向用户显示一个小的敬酒警报。
  • 等等等等。基本上,调度行为迫使您通过一个中心位置将应用程序中所有最重要的事情都传递出去,这样可以以任何您能想到的方式处理这些行为。
+0

能否详细说一下第二点谢谢! – darwinsenior

+0

刚刚添加了几个例子。 –

+0

我明白了。但我仍然不确定它何时有益。在rxjs中,debounce可以通过switchMap来实现,{url,params}可以只使用一张地图,我认为对于一个警戒情况来说,调用两个动作并不比打电话更好。唯一的区别似乎是所有的东西都和redux一起使用,但是不会引入全局变量,这可能是一个坏主意? – darwinsenior