[英]Update field value from predefined value redux-form
How to update redux form Field component value that was predefined from my redux store ? 如何更新从我的redux存储中预定义的redux表单字段组件值? I see my values in the fields but I can't type to update them. 我在字段中看到了我的值,但无法输入以更新它们。 I need to trigger onChange event but I don't know how. 我需要触发onChange事件,但我不知道如何。 Maybe is some way to set initialValue ? 也许是某种方法来设置initialValue吗? My package file: 我的包裹文件:
"redux": "3.7.2",
"redux-form": "^7.1.2",
"react": "16.0.0",
PS. PS。 I wanted to use defaultValue but since redux-form 5.0.0 it was deleted. 我想使用defaultValue,但是由于redux-form 5.0.0已被删除。
Code: 码:
import React,{Component} from 'react';
import {Field, reduxForm} from 'redux-form';
import {connect} from 'react-redux';
import {fetchCeoData} from '../../actions/CMS';
class CEOForm extends Component{
constructor(props) {
super(props);
this.renderTextarea = this.renderTextarea.bind(this);
}
componentDidMount(){
this.props.fetchCeoData();
}
submit(values){
console.log(values);
}
componentWillReceiveProps(nextProps){
console.log(nextProps);
}
renderTextarea({_id, title, description, content, input}){
return(
<div key={_id} className="cms-form-row">
<label htmlFor={title}>{description}</label>
<textarea {...input} value={content} rows="6" cols="50"></textarea>
</div>
)
}
render(){
return(
<section id="ceo-form">
<h1 className="cms-section-header">Narzędzia CEO</h1>
<div className="ceo-form-wrapper">
<form onSubmit={this.props.handleSubmit(this.submit)}>
{this.props.ceoData.map((item) => {
return <Field
name={item.title}
key={item._id}
title={item.title}
content={item.content}
description={item.description}
component={this.renderTextarea}
/>
})}
<button type="submit">Wyślij !</button>
</form>
</div>
</section>
)
}
}
function mapStateToProps(state){
return{
ceoData: state.ceoData
}
}
function loadData(store) {
return store.dispatch(fetchCeoData());
}
CEOForm = connect(mapStateToProps, {fetchCeoData})(reduxForm({form: 'ceo', enableReinitialize : true})(CEOForm));
export default{
loadData,
component: CEOForm
}
Ok. 好。 Here is what I end up with. 这就是我最终得到的。 I was reading post sugested in the comments: How to programatically set Redux-Form Field value But this solution Is kinda weird because you are manipulating by if statements. 我正在阅读评论中的帖子: 如何以编程方式设置Redux-Form字段值,但是此解决方案有点奇怪,因为您正在通过if语句进行操作。 I've came up with something like this: In mapStateToProps I used object property described in redux form as initialValue example: 我想出了类似这样的东西:在mapStateToProps中,我使用了以redux形式描述的对象属性作为initialValue示例:
Function mapStateToProps(state){
var data = _.pick(state.myprops, "name" );
return{
myprops: state.myprops,
initialValue: {
'nameOfMyField': data.name.fieldname
}
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.