简体   繁体   中英

Why React-intl not working inside ant-design?

FormattedMessage not working inside Form.Item element of ant-design, if FormattedMessage outside Form.Item element working well. Help me!

FormattedMessage outside Form.Item element working well

<Form.Item label={<FormattedMessage id="formSignIn.emailField" />}>
    {form.getFieldDecorator('email', {
        rules: [{ required: true, message: <FormattedMessage id="formSignIn.emailValidate" />}],
    })(
        <FormattedMessage id="formSignIn.emailValidate">
            {placeholder => (
            <Input prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />} placeholder={placeholder} />
            )}
        </FormattedMessage>,
    )}
</Form.Item>

FormattedMessage not working inside Form.Item element of ant-design

    class DemoForm extends React.Component {
        render() {
            const {getFieldDecorator} = this.props.form;
            const {intl} = this.props;
            const placeholder = intl.formatMessage({id:'enterHere'});

            return (
                 <Form.Item label={<FormattedMessage id='name'/>}>
                  {getFieldDecorator('name',)(<Input placeholder={placeholder}/>)}
                 </Form.Item>
            )
       }
}
export const Demo = injectIntl(Form.create()(DemoForm));

Use this Demo class for show your component.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM