element-ui input输入框偶尔会出现值绑不上

Question

如图，输入框明明有值，却提示错误，v-model值为空，代码如下。

<el-form-item label="用户id">
      <el-input v-model="public.userId" maxLength="6" oninput="value=value.replace(/[^\d]/g,'')"  placeholder="请输入用户id"></el-input>
    </el-form-item>

Answer 1

是否存在异步 外层加个setTimeout试试 因为element好多操作都是异步的

Answer 2

建议你 先用这个开发插件(https://github.com/vuejs/vue-...，是没绑定到 data 还是 获取时候 写的有问题

Answer 3

把public字段改成其他字段试试，占用关键字了。然后看看你有什么操作影响了userId的值，使其一直为空。。语法上是没问题的

Answer 4

<template>
    <div class="test">
        <el-form :model="form" :rules="rules" inline>
            <el-form-item label="ID" prop="ID">
                <el-input v-model="form.ID"></el-input>
            </el-form-item>
        </el-form>
        <el-button type="primary" @click="click">点我</el-button>
    </div>
</template>

<script>
export default{ 
    data(){
        return {
            rules: {
                ID: [{required: true,message: "此处不能为空", trigger: 'blur'}]
            },
            form:{},
        }
    },
    methods: {
        click(){
            this.$message({
                type: "info",
                message: this.form.ID
            })
        }
    }
}
</script>

<style>
</style>

Answer 5

仔细看了一下vue Devtools，发现是isOnComposition:true导致的，有没有大佬科普一下这个属性