dva的基本用法

2022-02-03 15:21:56 字數 1792 閱讀 8748

dva是乙個狀態管理工具,整合了redux,redux-saga,react-router,fetch等框架,目前只能用於react的狀態管理

1. dva的models

dva的主要作用還是整合了redux,redux-saga的多檔案的分散的寫法,將state,reducers,effects這些常用的狀態

處理方法集中在乙個model中,其形式如下:

import * as userservice from '../services/userservice'export 

default

, reducers: })

},removeitem(state, ) );

return}},

//effects指的是涉及到非同步請求的方法。通常用來呼叫服務獲取資料。

//這裡要注意如果effects的方法名與reducers中存在重複的話容易造成死迴圈。

effects: ) )

},*fetchremoveitem(,))

}else}},

subscriptions: ) )

}}}

2. dva的models的幾點說明

namespace:       全域性狀態的屬性,通過global.namespace來訪問對應model的state

reducers:           同步修改狀態的方法

effects:             非同步修改狀態的方法,effects中使用的還是generator,與redux-saga中的呼叫完全一致,

不能直接呼叫reducers中的同步方法,通過put()的形式來

呼叫reducer中的方法

這個結構與vuex的結構十分類似

state -> reducers -> effects 對應 state -> mutations -> actions

3. dva中的狀態傳遞

依然採用react-redux的方法,用connect,mapstatetoprops來解決

4. dva中的全域性事件

dva中提供了一下全域性的事件,來解決註冊和攔截問題

history,

initialstate,

onerror,

onaction,

onstatechange,

onreducer,

oneffect,

onhmr,

extrareducers,

extraenhancers,

});onerror:          effect 執行錯誤或 subscription 通過 done 主動拋錯時觸發,可用於管理全域性出錯狀態

onaction:        在 action 被 dispatch 時觸發,用於註冊 redux 中介軟體

onstatechange:     state 改變時觸發,可用於同步 state 到 localstorage,伺服器端等

onreducer:             封裝 reducer 執行,全域性攔截reducer

oneffect:                 封裝 effect 執行,全域性攔截effect

onhmr:                   全域性處理熱替換

extrareducers:        指定額外的 reducer

extraenhancers:      指定額外的 storeenhancer

參考:

dva的簡單理解

由於最近所接觸的專案是由dva框架進行書寫的,所以對dva進行了簡單的總結,僅供參考 dva是基於現有的應用基礎架構 redux react route react saga等 的一層輕量級的封裝 dva中model很重要,dva中的model實際上類似於封裝了redux裡面的action和redu...

mysql 的基本用法 mysql基本用法

mysql 5.1 中文參考手冊 show databases 顯示資料庫 drop database 資料庫名 刪除資料庫 set names utf8 設定資料庫編碼為utf 8 source x 資料庫名.sql 匯入乙個資料庫 use 資料庫名 嘗試訪問資料庫 create database...

mysql 的基本用法 mysql基本用法

mysql 5.1 中文參考手冊 show databases 顯示資料庫 drop database 資料庫名 刪除資料庫 set names utf8 設定資料庫編碼為utf 8 source x 資料庫名.sql 匯入乙個資料庫 use 資料庫名 嘗試訪問資料庫 create database...