我们应该使用状态或道具来处理还原反应中的输入吗?

时间:2017-01-09 18:47:56

标签: reactjs redux react-redux

我对道具或国家在这里使用感到困惑。如果我在@connect中使用状态,我会收到错误并且不起作用。当我使用道具时,它不能与onchange处理程序一起设置新的道具。请帮助我如何使用状态或道具进行输入。我正在从api中检索初始数据。

import React, {PropTypes} from 'react';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import { asyncConnect } from 'redux-async-connect';
import {load, isLoaded} from 'redux/modules/overview';
@asyncConnect([{
promise: ({ store: { dispatch, getState }, params: { id }, }) => {
    const promises = [];
    if (!isLoaded(getState())) {
        promises.push(dispatch(load(id)));
    }
    return Promise.all(promises);
}
}])
@connect(
state => ({
    overview: state.overview.data
}),
dispatch => bindActionCreators({load}, dispatch))
export default class Overview extends React.Component {
changeinput1(e) {
    this.props.overview.title = e.target.value;
    // changing value does not work here
}
constructor (props) {
    super();
    this.state = {
        overview: null,
    }
}
render() {

    return (
        <div>
        <label>Input 1</label>
        <input type="text" className="form-control" id="title" name="title" maxlength="35" value={this.props.overview.title} onChange={this.changeinput1.bind(this)}/>
        </div>
    )
}
}

我也想进行验证并希望在onBlur上保存输入值,所以我不想使用表单。

1 个答案:

答案 0 :(得分:0)

如果你想改变减速器(这里假设是'概览')值,你应该定义一个动作然后调度它,而不是直接改变它,来自商店的状态来自于组件中的只读