还原形式的状态不会改变

时间:2018-04-15 20:23:56

标签: reactjs redux redux-form

国家的反应形式并没有改变。 console.log(renderselect)没有值 - 它会显示undefined

我尝试了一切,但没有任何变化。

import React from "react";
import {Field, reduxForm} from "redux-form";
import {connect} from 'react-redux';
import {renderTextField, renderField, validate, warn, renderselect} from "../../../Components/Forms/renders"
class SyncValidationForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      errors: {},
      opencheck: "hallo"
    }
     this.handleSelect = this.handleSelect.bind(this);
  }
  handleSelect = (value) => {
    this.setState({"opencheck": value.target.value});
  };
  render() {
    const {handleSubmit, pristine, reset, submitting, opencheck} = this.props;
    console.log(opencheck);

    return (<form onSubmit={handleSubmit}>
          <div className="box-body">
            <div className="row">
              <div className="col-lg-3">
                <Field className="form" name="favoriteColor" label="Maak eerste een keuze" component={renderselect} options={{
                    "Geen informatie" : 'Geen informatie',
                    'Altijd open' : 'Altijd open'
                  }}
                onChange={this.handleSelect}/>
              </div>
        </div>
      </div>
    </form>);
  }
};

SyncValidationForm = reduxForm({
  form: 'insertstart', enableReinitialize: true,
  warn
})(SyncValidationForm);

const mapStateToProps = state => {
  state => ({
    initialValues: { favoriteColor: 'Geen informatie' }
  })
}

export default connect(mapStateToProps)(SyncValidationForm)

所选框必须更改状态,但没有更改。此外,在第一个渲染中,控制台日志中的opencheck没有值。

1 个答案:

答案 0 :(得分:2)

您正在将 Redux状态(使用内置的 React组件状态mapStateToProps映射到您的React组件的道具)混淆这与Redux无关。在继续之前,您可能希望阅读这些链接以充分了解其中的区别:

这些通常集成的图书馆都称其数据源为“状态”,这经常让人感到困惑和沮丧,但是了解差异并确定哪一个对您来说很重要正在使用。

如果要使用Redux存储选定状态,则handleSelect函数需要将新值分派到Redux存储,通常使用mapDispatchToProps来分发一个动作,而不是通过调用this.setState

如果您想使用React组件状态,则需要在this.state.opencheck函数中引用render(),而不是this.props. opencheck

相关问题