在onChange事件中获取redux-Form的值,可以通过以下步骤实现:
import React from 'react';
import { Field } from 'redux-form';
const MyComponent = () => {
return (
<div>
<label>My Field:</label>
<Field name="myField" component="input" type="text" />
</div>
);
};
export default MyComponent;
import React from 'react';
import { reduxForm } from 'redux-form';
const MyComponent = ({ handleSubmit }) => {
const handleChange = (event, newValue, previousValue) => {
// 在这里处理字段值的变化
console.log(newValue);
};
return (
<form onSubmit={handleSubmit}>
<label>My Field:</label>
<Field
name="myField"
component="input"
type="text"
onChange={handleChange}
/>
<button type="submit">Submit</button>
</form>
);
};
export default reduxForm({
form: 'myForm',
})(MyComponent);
在上面的代码中,我们定义了一个名为handleChange的函数来处理字段值的变化。当字段的值发生变化时,redux-form会调用这个函数,并传递新值和旧值作为参数。你可以在这个函数中执行任何你需要的操作,例如打印新值到控制台。
注意:在使用redux-form时,你不需要直接在onChange事件中获取字段的值。redux-form会自动处理表单字段的值,并将其存储在Redux store中。你可以通过使用redux-form的connect函数将表单的值连接到Redux store,并在需要的地方获取它们。
希望这个回答对你有帮助!如果你想了解更多关于redux-form的信息,可以访问腾讯云的相关产品文档:redux-form产品介绍。
领取专属 10元无门槛券
手把手带您无忧上云