here is an example of the form extracted from the antd-mobile document:
import { List, InputItem, WhiteSpace } from "antd-mobile";
import { createForm } from "rc-form";
class BasicInputExample extends React.Component {
handleClick = () => {
this.inputRef.focus();
};
render() {
const { getFieldProps } = this.props.form;
return (
<div>
<List renderHeader={() => "Format"}>
<InputItem {...getFieldProps("phone")} type="phone" placeholder="186 1234 1234"></InputItem>
<InputItem {...getFieldProps("password")} type="password" placeholder="****"></InputItem>
</List>
</div>
);
}
}
I want to use getFieldDecorator () instead of getFieldProps (),. Here is an example of getFieldDecorator () extracted from the rc-form document:
class Form extends React.Component {
handleSubmit = (e) => {
e.preventDefault();
const {validateFields} = this.props.form;
validateFields()
.then(console.log)
.catch(console.error);
};
render() {
const {getFieldDecorator} = this.props.form;
return (
<div>
<form onSubmit={this.handleSubmit}>
{getFieldDecorator("name", {rules: [{required: true,}],})(<input/>)}
<button type="submit">submit</button>
</form>
</div>
);
}
}
question:
I want to replace getFieldProps () in the first example with getFieldDecorator (). How should I modify the code in the first example?