使用React和redux从不同的reducer调用操作
使用React和redux从不同的reducer调用操作
提问于 2015-10-01 04:59:29
我有两个组件:一个市场和一个状态。status组件管理用户拥有的钱的数量，市场有按钮来购买一些东西。当我点击按钮(在市场部分)时，我想要我的钱减少。
我怎样才能以最好的方式做到这一点呢？
这是我的App组件，具有Market和Status：
import React from 'react';
import { Link } from 'react-router';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import * as MarketActions from '../actions/market-actions';
import * as StatusActions from '../actions/status-actions';
import Market from './Market.react';
import Status from './Status.react';
export default class App extends React.Component {
render() {
const { dispatch, market, status } = this.props;
return (
<div>
<h1>App</h1>
<Link to='/'>App</Link>{' '}<Link to='/home'>Home</Link>
<Status status={status} {...bindActionCreators(StatusActions, dispatch)} />
<Market market={market} {...bindActionCreators(MarketActions, dispatch)} {...bindActionCreators(StatusActions, dispatch)} />
{this.props.children}
</div>
);
}
}
export default connect(state => ({ market: state.market, status: state.status }))(App);我从市场组件上的状态绑定了操作(我觉得这不是正确的做法，但它起作用了)。
在此之后，我只需单击如下按钮即可在Market组件中处理这些操作：
handleBuyClick(e) {
let { index, price } = e.target.dataset;
index = parseInt(index);
price = parseInt(price);
this.props.buyItem(index);
this.props.changeMoney(price); //this bugs me, i think it don't belongs there
}有没有更好的方法？
谢谢
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-10-03 21:03:24
为什么不在两个减速器中对相同的动作做出反应呢？你可能会有这样的代码：
function status(state, action){
...
switch(action.type){
case BUY_ITEM: {
return 'bought'
}
}
...
}
function market(state, action){
...
switch(action.type){
case BUY_ITEM: {
return {...state, action.itemId : state[action.itemId] - 1 }
}
}
...
}任何你需要执行的“反应代码”。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/32875518
复制相关文章
相似问题