我是靠谱客的博主 超级心锁,最近开发中收集的这篇文章主要介绍Redux的调试工具Redux DevTools,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

Redux DevTools是一款用于调试的浏览器插件,它用来时时显示当前应用的state信息,action触发记录以及state的变化,在开发过程中非要有用,目前这个插件支持chrome和FireFox浏览器,我们以chrome为列,在chrome的应用商店中下载安装Redux DevTools插件,然后在configStore.js中,使用Redux DevToold创建"加强版"的store:

import {create,applyMiddle,applyMiddleware,compose} from "redux";

import thunk from "redux-thunk";

import rootReducer from "./modules";

let finalCreateStore;

//假如浏览器运行在非生产模式下,且浏览器安装了调试插件,则创建包含调试插件的store

if(process.env.NOT_ENV!=="production"&&window.__REDUX__DEVTOOLS__EXTENSION__){

  finalCreateStore=compose(

   applyMiddleware(thunk),

   window.__REDUX__DEVTOOLS__EXTENSION__()

)(createStore)

}else{

   finalCreateStore=applyMiddleware(thunk)(createStore)

}

export default function configureStore(initialState){

  const store=finalCreateStore(rootReducers,initialState);

  return store;

}

//注我们只在开发环境下启用Redux DevTools。运行程序,打开chrome浏览器开发者根据窗口,选择Redux标签页,既可看到Redux DevTools的效果。

最后

以上就是超级心锁为你收集整理的Redux的调试工具Redux DevTools的全部内容,希望文章能够帮你解决Redux的调试工具Redux DevTools所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(43)

评论列表共有 0 条评论

立即
投稿
返回
顶部