[英]React Native/Redux: How to pass down updated state to child components every time state changes?
[英]React Native with Redux : state changes not showing in console
当我将console.log('test')
语句放在我的减速器中时,我可以在调用操作时在控制台中看到它们。 但我没有在控制台中看到 redux "NEXT STATE"/"PREV STATE" 的东西。
有什么基本的我可能会遗漏吗?
在下面的代码中 - 我不是要实现任何真正的功能,我只是想设置 redux 并查看控制台中的状态更改(所以我知道我在正确的路径上)。
集装箱
import React, { PropTypes } from 'react-native';
import Header from './Header';
import { connect } from 'react-redux';
import { leave } from './actions';
import { join } from './actions';
const mapStateToProps = (state) => {
return {
in: state.in
}
}
const mapDispatchToProps = (dispatch) => {
return {
join: (id) => {
dispatch(join(id))
},
leave: (id) => {
dispatch(leave(id))
}
}
}
export default connect(mapStateToProps, mapDispatchToProps)(Header);
减速机
export default function Header(state = { in: false }, action = {}) {
switch (action.type) {
case 'LEAVE':
return {
...state,
in: false
}
case 'JOIN':
console.log(state);
console.log(action);
console.log('join');
return {
...state,
in: true
}
default:
return state;
}
}
行动
export const join = (id) => {
return {
type: 'JOIN',
payload: {
in: true
}
}
}
export const leave = (id) => {
return {
type: 'LEAVE',
payload: {
in: false
}
}
}
当我意识到需要单独安装https://github.com/fcomb/redux-logger时,它解决了。
正如您已经确定的,您需要安装 redux-logger 中间件。 https://github.com/evgenyrodionov/redux-logger
从他们的文档:
import { applyMiddleware, createStore } from 'redux';
// Logger with default options
import logger from 'redux-logger'
const store = createStore(
reducer,
applyMiddleware(logger)
)
我只在开发环境中这样做
const middlewares = [];
if (process.env.NODE_ENV === 'dev') {
middlewares.push(logger);
}
const store = createStore(
reducer,
applyMiddleware(...middlewares)
)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.