6 從零開始學react redux相關

2021-10-06 19:34:24 字數 3898 閱讀 4818

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;

}}

reducer使用,store建立

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=

/>

}

7-2 connect寫法

(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 ...