/中文/
/中文/
/中文/
/中文/
/中文/
/中文/
/中文/
/中文/
/中文/
/中文/
聽說你需要穀歌瀏覽器調試插件嗎?小編在這裏趕緊給你找了一款您看看喜不喜歡!Redux-DevTools中文版讓你在這裏直接就能開始對穀歌瀏覽器進行調和和相關的操作,Redux-DevTools中文版想要重置瀏覽器界麵和設置個性瀏覽器的朋友們直接在軟件裏麵修改就可以了!
提供redux-devtools離線安裝crx文件,通過redux-devtools, 我們可以清晰的看到當前store倉庫中的state是怎麼樣的,在可視化工具的左邊,用於調試應用程序的狀態更改,我們還可以看到觸發的action的變化!
import Redux from 'redux'
/ 引入createStore創建store,引入applyMiddleware 來使用中間件
import {createStore, applyMiddleware} from 'redux'
/ 引入所有的reducer
import storeReducer from '../Reducer/index.jsx'
export default createStore(storeReducer);
下載安裝redux-devtools。
要想使用chrome redux調試插件,還需要在項目中安裝 redux-devtools-extension 插件。其安裝方法如下:
即在項目中直接執行下麵的安裝命令:
npm install redux-devtools-extension --save-dev
在使用Chrome Redux調試插件之前,我們需要做一些項目的基本配置。我們要安裝到項目的一些基本使用,如: react、redux、react-redux等。基本框架如下:
安裝成功後,還需要redux-devtools在項目中的配置,實際上就是在創建store的時候把redux-devtools安裝即可。
import Redux from 'redux'
// 引入createStore創建store,引入applyMiddleware 來使用中間件
import {createStore, applyMiddleware} from 'redux'
// 引入所有的reducer
import storeReducer from '../Reducer/index.jsx'
// 利用redux-logger打印日誌
import {createLogger} from 'redux-logger'
// 安裝redux-devtools-extension的可視化工具。
import { composeWithDevTools } from 'redux-devtools-extension'
// 使用日誌打印方法, collapsed讓action折疊,看著舒服。
const loggerMiddleware = createLogger({collapsed: true});
export default createStore(
storeReducer,
composeWithDevTools( )
);