Redux Alternative

我最近開始學習React，並且很快遇到了一個充滿函數和狀態的臃腫父組件的問題。起初，我看着Flux，然後我看着Redux，但都覺得真的很霸道。Redux Alternative

我很奇怪，爲什麼這樣的事情沒有完成：

//EventPropagator.js 
let EventPropagator = { 
    registerListener(listenerObject){ 
     if (this.listeners == null) 
      this.listeners = [] 
     this.listeners.push(listenerObject) 
    }, 
    fireEvent(eventObject){ 
     let listenerList = this.listeners.filter(function(listener){ 
      return listener.eventType === eventObject.eventType 
     }) 
     listenerList.forEach((listener) => { 
      listener.callback(eventObject.payload) 
     }) 
    } 
} 
export default EventPropagator

使用方法：成分簡單registerListener和fireEvent：

//main.js 
import EventPropagator from './events/EventPropagator' 

EventPropagator.registerListener({ 
    "eventType": "carry_coconut", 
    "callback": (payload) => { 
     // actually carry coconut 
     this.setState({"swallow_type": payload.swallow}) 
     console.log(payload) 
    } 
}) 
EventPropagator.fireEvent({ 
    "eventType": "carry_coconut", 
    "payload": { "swallow": "african" } 
})

這將使大量的去耦和狀態可能的很容易被這種事件傳遞。這種方法有什麼缺點？

來源

2016-11-09 jcuenod

Jumpstate看起來不錯https://github.com/jumpsuit/jumpstate。 – imns

這種方法可以解決跨組件通信的問題，但是您仍然需要在'state'中本地管理每個組件數據。除了動作和縮減器之外，redux也有幫助，所以您不必考慮本地狀態，以及如何保持它（可能是很多）組件之間的同步。 –

你應該嘗試mobX

mobX是一個狀態管理庫，注意到decorators的優勢，成功地消除不必要的代碼。例如，mobx中沒有reducers的概念。

希望這會有所幫助！

來源

2016-11-10 04:48:46

這看起來很有趣，但仍有比上述更高的學習曲線，它並不像我看起來好像你獲得很多......感謝鏈接，但我會更詳細地看看它！ – jcuenod

需要的是一個事件驅動的系統，所以一個子組件可以對其兄弟說話，但這並不意味着數據應該作爲事件有效載荷傳遞。這將導致一個沒有治理的系統，也是一個多個開發人員正在開發的項目的噩夢。

只要你遵循flux-like架構模式（谷歌它），那麼你實際上可以做到這一點，只需javascript和Javascript對象來保存數據以及事件系統。

應將數據視爲三種不同狀態之一。這是從服務器

轉換後的數據（從原來的轉化）

存儲數據或者

原始數據拉。那作爲UI綁定的模型

如果您編寫一個JavaScript庫來處理三種狀態之間的數據移動並處理轉換，您可以使用事件系統來激活「存儲改變了「組件可以收聽和自我再現的事件。

來源

2017-02-07 20:47:15 PrimeLens

Redux是React聲明式編程風格的延續。將應用程序邏輯映射到組件的一種簡單方法是使用Backbone.React.Component之類的東西，但使用redux，可讓您使用所有工具&中間件。在你的應用程序中也有無限的轉換，使調試變得更容易。現在，我同意你需要很多配線&樣板才能拿到。

如果你想使用終極版，你可以看看像redux-auto

終極版 - 汽車：終極版輕鬆（有即插即用的方式）

取出樣板代碼中設置一個商店&的行動。爲什麼？此實用程序允許您在很短的時間內啓動並運行Rudux！

你可以看到現在redux-auto: helloworld project

來源

2017-06-25 13:45:14 codemeasandwich

也許增加一個免責聲明，這是你的項目。 – jcuenod

回答

相關問題