6 從零開始學react redux相關

store

reducer, dispatch, action

redux

react-redux

provider, connect

usedipatch, useselector, usestore

引入建立倉庫方法:import from 'redux';倉庫需要引數：reducer

createstore(reducer)建立reducer, reducer是純函式

reducer有兩個引數：state和action

reducer(state = ?, action) {}

多個reducer:combinereducers()

純函式：（如果函式的呼叫引數相同，則永遠返回相同的結果。函式不會產生任何可觀察的***）

reducer.js

export

default
reducera
(state =
, action)
;case
'loading_end'
:return
;default
:return state;
}}

import

from
'redux'
import homereducer from
'./reducer'
import thunk from
'redux-thunk'
const reducers =
combinereducers()
export
default
createstore
(reducers,
(thunk)
)

4-2) usedispatch -import from 'react-redux'

// 4-1

import
from
'react-redux'
export
default
connect
( state =>},
dispatch =>})
(mycomponent)

// 4-2

import
from
'react-redux'
const dispatch =
usedispatch()
;// do sth with dispatch

action是乙個物件，必須包含type屬性

store倉庫的使用：需要乙個提供者元件import from 'react-redux'

reactdom.

render
(>
>
<
/provider>
, document.
getelementbyid
('root'))
;

獲取資料並展示：

7-1）不使用store

7-2）使用connect把獲取資料的方法提取出來

7-3）使用hooks把獲取資料的方法提取出來

7-1 不使用store展示資料

// 7-1）

import react,
from
'react'
import
from
'react-router-dom'
export
default
function homepage 
=useparams()
;const
[data, setdata]
=usestate([
]);const
[loading, setloading]
=usestate
(true);
useeffect((
)=>
&tab=
$&limit=10`).
then
(res =>)}
},[loading]
)useeffect((
)=>
,[type, page]
)return
loading=
/>
}

(homepage)7-3 hooks寫法

零開始學python 從零開始學Python

第1章 python入門 1 1 1 什麼是python 1 1 2 python語言有什麼特點 2 1 3 python可以幹什麼 4 練一練 5 第2章 準備開發環境 6 2 1 在windows上安裝python開發環境 6 2 2 選擇和安裝開發工具 11 練一練 17 第3章 基本概念 1...

從零開始學android

相對布局管理器指的是參考某一其他控制項進行擺放，可以通過控制，將元件擺放在乙個指定參考元件的上 下 左 右等位置，這些可以直接通過各個元件提供的屬性完成。下面介紹一下各個方法的基本使用 no.屬性名稱 對應的規則常量 描述1 android layout below relativelayout.b...

從零開始學 樹

在之前做二級的題的時候，偶爾會碰見二叉樹，很自然的就想起了樹，那麼什麼是樹呢？這裡說的可不是外面的參天大樹，而是有實際概念的樹，下面就來介紹一下樹。樹是由n n 0 個結點組成的有限集合。若n 0，稱為空樹 若n 0，則 1 有乙個特定的稱為根 root 的結點。它只有直接後繼，但沒有直接前驅 2 ...