vue数据改变视图不改变

Question

代码是这样的：
里面这个span就是我要通过数据去改变它的一个是否存在

<el-form-item label="重点要求（标签）：">
                <span style="color: #ccc;font-size: 13px;">可以创建多个标签，每输入一个标签后可点击回车键确定，再输入下一个</span>
                <el-input @change="requireChange" v-model="str" placeholder="请输入内容"></el-input>
                <span style="padding: 7px 13px;background-color: #5EADFF;border-radius: 10px;margin-right: 15px;" v-for="(item,index) in ruleForm.requires" :key="index"><span style="padding: 0 7px;" @click="dltRequire(index)" class="iconfont el-icon-delete-solid"></span>{{item}}</span>
            </el-form-item>

dltRequire(index) {
        this.$nextTick(() => {
            let requires = this.ruleForm.requires
            requires.splice(index,1)
            this.ruleForm.requires = requires
            console.log('requires',requires);
            console.log('this.ruleForm.requires',this.ruleForm.requires);
        })
    },

大🐂们，请问问题出在哪啊

Answer 1

别拿index作为key值
有id的话用id没有就用Math.floor(Math.random() * 1000000000000)
可以的话给个采纳