[英]Using props.change to change the value of an input field in redux-form
I have a form that needs to retrieve the value of a field from my backend.我有一个需要从后端检索字段值的表单。 It seems to retrieve the value successfully, but it does not update the value in the form.
似乎成功检索到值,但它没有更新表单中的值。
How I use props.change to try to update field "foo":我如何使用 props.change 尝试更新字段“foo”:
const asyncValidate = (values, dispatch, props) => {
return axios
.get(URL)
.then( (response) => {
var whyNoChange = props.change("foo", response.data.foo)
console.log(whyNoChange)
});
}
Foo component: Foo 组件:
const fooField = (props) => (
<Form.Field
error={props.meta.touched && props.meta.error ? true : false}>
<Input
placeholder='Change me'
onBlur={props.input.onBlur}
onFocus={props.input.onFocus}
onChange={(param, data) => props.input.onChange(data.value)}
value={props.input.value}
/>
{
props.meta.touched &&
props.meta.error &&
<span style={{color: '#9f3a38'}}>
{props.meta.error}
</span>
}
</Form.Field>
)
My form:我的表格:
class MyForm extends Component {
// ...
render () {
return (
<Form>
<Field
name='foo'
component={fooField}
/>
</Form>
)
}}
MyForm = reduxForm({
form: 'myform',
validate,
asyncValidate
})(MyForm)
And finally what the console logs when it dispatches redux-form/change ...最后控制台在调度 redux-form/change 时记录什么......
{…}
>meta: Object { form: "myform", field: "foo", touch: false, … }
payload: "foo-from-backend"
type: "@@redux-form/CHANGE"
But my foo-field value doesn't get updated.但是我的 foo-field 值没有更新。 I checked the react developer tools and the value is just "".
我检查了反应开发人员工具,该值只是“”。 I followed the change directions as per the documentation .
我按照文档中的更改说明进行操作。 Any advice on where to go from here would be greatly appreciated.
任何关于从这里去哪里的建议将不胜感激。 I am new to react and redux-form.
我是 react 和 redux-form 的新手。
First of all, you have to dispatch it.首先,您必须发送它。 Secondly, you are assigning a
void
function to a variable without calling it.其次,您将
void
函数分配给变量而不调用它。 Lastly, I believe that change
accepts three arguments - form name
, field name
and value
.最后,我相信
change
接受三个参数 - form name
、 field name
和value
。
const asyncValidate = (values, dispatch, props) => {
return axios
.get(URL)
.then( (response) => {
dispatch(change("form name", "foo", response.data.foo))
});
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.