微信小程序weUI <mp-form>提交清空input框的值

当使用mp-form使用按钮提交,数据通过models绑定,点击提交的时候需要清空input框里的值,试过将formData的值置为空,没有效果

最后想到的办法是,将每个input使用model:value绑定数据,点击按钮之后通过将值设为空来清除input框中的内容

<mp-toptips msg="{{error}}" type="error" show="{{error}}">mp-toptips>
    <mp-form id="form"  class="cont_add_a1" rules="{{rules}}" models="{{formData}}">
        <mp-cells class="my-cells">
            <mp-cell prop="name"  class="a1_item" title="姓名" >
                <input bindinput="formInputChange" model:value="{{name}}" data-field="name" class="weui-input" placeholder="请输入姓名"/>
            mp-cell>
            <mp-cell prop="phone" class="a1_item" title="手机号码" > 
                <input bindinput="formInputChange" model:value="{{phone}}" data-field="phone" class="weui-input" placeholder="请输入手机号码"/>
            mp-cell>
        mp-cells>

        
        <view slot="button">
            <button class="btn" style="margin: 88rpx auto;" bindtap="submitForm">提交button>
        view>
    mp-form>
	 submitForm() {
        console.log(this.data.formData)
        this.selectComponent('#form').validate((valid, errors) => {
            console.log('valid', valid, errors)
            if (!valid) {
                const firstError = Object.keys(errors)
                if (firstError.length) {
                    this.setData({
                        error: errors[firstError[0]].message
                    })

                }
            } else {
                // 提交资料
                this.setData({
                    [`formData.phone`]: '',
                    name: '',
                    phone: ''
                })
				console.log('已清空')
            }
        })
        // this.selectComponent('#form').validateField('mobile', (valid, errors) => {
        //     console.log('valid', valid, errors)
        // })
    },    

你可能感兴趣的:(微信小程序,javascript,小程序)