antd-mobile表单赋值,没有触发onChange和validate

发布于 2022-09-11 16:16:58 字数 1256 浏览 21 评论 0

描述:

点击按钮给antd-mobile的输入组件InputItem进行赋值,用的方法是this.props.form.setFieldsValue(),但是赋值不成功,输入框中未出现数值

相关代码

<List>
    <InputItem className="customized-input"
        {...getFieldProps("money", {
            normalize: (v, prev) => {
                if (v && !/^(([1-9]\d*)|0)(\.\d{0,2}?)?$/.test(v)) {
                    if(v === "."){
                        return "0.";
                    }
                    return prev;
                }
                return v;
            },
            rules: [
                {validator: this.validateAmount}
            ],
            onChange: (v) => this.getTradeShare(v)
        })}
        type={type}
        maxLength={8}
        placeholder={placeholder}
        ref={el => this.inputRef = el}
        onVirtualKeyboardConfirm={v => this.getTradeShare(v)}
        clear
        moneyKeyboardAlign="left"
        moneyKeyboardWrapProps={moneyKeyboardWrapProps}
    >
    </InputItem>
</List>
按钮绑定事件
setAmount(amount) {
    this.props.form.setFields({
        'money' : amount
    });
}

预期结果

点击按钮赋值成功,输入框中显示数值,触发校验规则

实际结果

赋值不成功,输入框未显示数值,未触发校验规则

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文