初學redux

gaosboy 發布于2019-08-20 16:32 / 1057人閱讀

摘要：加法操作減法操作當前應用的所有狀態都保存在的樹中，這是一個集合想要修改中的數據，必須要發送，可以在任何時候調用發送會作為第二個參數觸發創建時傳入的函數第一個參數是當前的樹函數會根據中的信息，返回一個新的樹存入這使得程序的運行在界面出現之前

import { createStore } from "redux"

const initState = {
    count:0
}

const ADD_TODO = {
    type:"ADD",
    payload:"加法操作"
}

const LESS_TODO = {
    type:"LESS",
    payload:"減法操作"
}

const counter = (state = initState,action) => {
    switch(action.type){
        case "ADD":
            return {
                count:state.count+1
            }
        case "LESS":
            return {
                count:state.count-1
            }
        default:
            return state;
    }
}

let  store = createStore(counter);

let unlistener = store.subscribe(()=>{
    console.log(store.getState())
})

store.dispatch(ADD_TODO);
store.dispatch(ADD_TODO);
store.dispatch(ADD_TODO);
store.dispatch(LESS_TODO);

unlistener()

當前應用的所有狀態都保存在store的state樹中，這是一個集合
想要修改state中的數據，必須要發送action，可以在任何時候調用dispatch發送action
action會作為第二個參數觸發創建store時傳入的Reducer函數,第一個參數是當前的state樹
Reducer函數會根據action中的信息，返回一個新的state樹存入store
這使得程序的運行在界面出現之前就變得可以預測：
UI組件使用初始的state樹，當界面需要改變時，觸發action，改變store中state樹的數據,然后重新渲染顯示

GPU云服務器云服務器 Redux redux源碼 redux-saga react-redux

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/82980.html

適合初學者觀看的深入淺出react全家桶（一）

摘要：本系列文章主要是介紹一些概念原理深入，適合有點基礎的初學者觀看。是狀態容器，提供可預測化的狀態管理。使用單向數據流，這意味著只能父組件傳遞給子組件。工作流工作流如下圖關于數據流的原理還有大佬不懂這個話，大佬可以點擊傳送門本系列文章主要是介紹redux一些概念原理深入，適合有點react基礎的初學者觀看。分別講述了Reudx、React Hooks等內容。部分內容涉及源碼解析。 wh...

DandJ 2019-08-26 13:44 評論0 收藏0
【譯】Redux 還是 Mobx，讓我來解決你的困惑！

摘要：我現在寫的這些是為了解決和這兩個狀態管理庫之間的困惑。這甚至是危險的，因為這部分人將無法體驗和這些庫所要解決的問題。這肯定是要第一時間解決的問題。函數式編程是不斷上升的范式，但對于大部分開發者來說是新奇的。規模持續增長的應原文地址：Redux or MobX: An attempt to dissolve the Confusion 原文作者：rwieruch 我在去年大量的使用...

txgcwm 2019-08-22 11:06 評論0 收藏0
react-redux-express異步前后端數據交互(面向初學者,高手勿進)

摘要：花了整整三天的時間來解決一個非常非常小的問題想要把一點心得體會記錄下來首先是問題的提出前端如果是后端是如何進行數據的交互總體思路以前接觸的時候前端模板用的是那時候就有些不理解的地方最為不理解的幾個問題是前端和后端怎么配合特別是前端特別復雜的花了整整三天的時間來解決一個非常非常小的問題.想要把一點心得體會記錄下來.首先是問題的提出:前端如果是react,后端是express,如何進行數...

KaltZK 2019-08-19 18:44 評論0 收藏0
Redux概念之二: Redux的三大原則

摘要：就是應用程序領域的狀態，它是類型中的模型的設計的概念，這設計是由架構而來的，在原本的架構中是允許多個的結構，簡化為只有單一個。的設計中是與中的相比，它們之間有一些類似的設計。 Redux里的強硬規則與設計不少，大部份都會與FP(函數式程序開發)、改進原本的Flux架構設計有關。Redux官網文檔上的三大基本原則，主要是因為有可能怕初學者不理解Redux中的一些限制或設計，所以先寫出來說...

dingda 2019-08-20 13:59 評論0 收藏0
React組件設計實踐總結05 - 狀態管理

摘要：要求通過要求數據變更函數使用裝飾或放在函數中，目的就是讓狀態的變更根據可預測性單向數據流。同一份數據需要響應到多個視圖，且被多個視圖進行變更需要維護全局狀態，并在他們變動時響應到視圖數據流變得復雜，組件本身已經無法駕馭。今天是 520，這是本系列最后一篇文章，主要涵蓋 React 狀態管理的相關方案。前幾篇文章在掘金首發基本石沉大海, 沒什么閱讀量. 可能是文章篇幅太長了？掘金值太低了？ ...

ideaa 2019-05-23 11:48 評論0 收藏0