uniApp v-key 数据绑定表示

<template>
    <view>
      <!--这个key 也是和vue一样的 是保证组件的唯一性 和 数据的唯一性-->
        <block v-for="(item,idnex) in studentArray" :key = "item.id">
            <checkbox> {{item.name}} </checkbox>
            <br>
        </block>
        <button style="background-color: #007AFF; color: #FFFFFF;" @click="addStudent">添加同学</button>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                studentArray:[
                    {id:1086,name:"张三",age:23},
                    {id:1087,name:"咸瑜",age:18},
                    {id:1088,name:"曾阿牛",age:39},
                    {id:1089,name:"00",age:17},
                    {id:1090,name:"小闫妮",age:28}
                ]
            }
        },
        methods: { 
            addStudent(){
                let id = ++this.studentArray[this.studentArray.length-1].id;  //模拟id自增长
                let name = "NewStudent" + id;
                let age = Math.floor((Math.random()*50) + 10);
                let newStu = [];
                newStu.id = id;
                newStu.name = name;
                newStu.age = age;
                this.studentArray.push(newStu);
            }
        }
    }
</script>

<style>

</style>

 

 主要逻辑在JS中  主要是看key 的