vue页面数组渲染页面 刷新问题

开发过程中经常操作数组，删除数组中的元素的时候。可能删除成功但是，重新赋值给data的数组时。发现数据不对，页面显示也不对。

1.添加v-if到渲染的标签上。

2.在删除数组的元素后，使用$nextTick。

3.在$nextTick函数里面更新isShow的状态，使v-if重新更新dom数据渲染。

<template>

<div v-if="isShow">
    <div v-for(item,index) in list :key="index">
        {{item}}
        <span @click="deleteItem(index)" >删除</span>
    </div>
</div>

</template>

<script>
export default {

    data(){
        return{
            list:[]
            isShow: true,
        }
    },
    methods:{
        deleteItem(index){
            this.isShow = false;
            // 删除
            this.list.splice(index,1)
            // 删除后发现数组的数据不对，使用nextTick。
            this.$nextTick(() => {
                // 强制更新dom，使页面刷新。
                this.isShow = true;
            }
        }
    }
}
</script>