uniapp开发中踩坑记录modelValue|this.$refs.form.setRules(this.rules)|this.formData.list.push(obj)

 问题复现:

 简单说就是:

1、如果在modelValue绑定表单数据formData
2、onReady设置规则自定义校验规则rules
3、在js中首次对formData对象的list数组push对象时会造成formData多了一个list[0]元素。
    具体产生原因尚未清晰。如果不在表单绑定formData,或者不在onReady设置自定义校验规则rules则不会产生list[0]元素,亦或push的不是对象是字符串也不会出现此问题。

 

<template>
    <view>
        <uni-forms  ref="form" :modelValue="formData">//使用modelValue绑定表单数据
                    <uni-forms-item name="name" label="姓名">
                        <uni-easyinput v-model="formData.name" type="text" placeholder="请输入" />
                    </uni-forms-item>
                    <uni-forms-item name="sex" label="性别">
                        <uni-easyinput v-model="formData.sex" type="text" placeholder="请输入" />
                    </uni-forms-item>
                    
                    <button class="button" @click="submit">控制台打印</button>
                </uni-forms>
    </view>
</template>
export default {
        data() {
            return {
                formData:{
                    name:'',
                    sex:'',
                    list:[],
                },
                rules: {
                    name: {
                        rules: [{
                            required: true,
                            errorMessage: '请选择设备',
                        }]
                    },
                    sex: {
                        rules: [{
                            required: true,
                            errorMessage: '请选择故障类别',
                        }]
                    },                
                }
            }
        },
        onReady() {
            // 包含自定义校验规则所以需要在onReady中设置规则
            this.$refs.form.setRules(this.rules);
        },
        methods: {
            submit(){
                let obj={
                    text:'bbb',
                    value:'aaa'
                }
                this.formData.list.push(obj)//在此对数组push对象
                console.log('点击',this.formData)                
                //此时控制台打印的this.formData对象多了个list[0]    元素        
            }
        }
    }


 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

djlhf

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值