我页面上有三个ul，我点击的时候切换ul里面的内容，但是我切换的时候会看到上一个ul的内容闪一下，怎么解决这个闪一下的问题呢？

Question

我页面上有三个ul，我点击的时候切换ul里面的内容，但是我切换的时候会看到上一个ul的内容闪一下，怎么解决这个闪一下的问题呢？
我代码是这样的

          <ul>
            <li v-for="(item,index) in shebeide">
                <span class="span_three" :title="item.deviceName">{{item.deviceName}}</span>
                <button @click="tianjianshei(item,index)" class="tianjian_lei">确定</button>
            </li>
            </ul>
            

页面的效果是这样的

每当我点击按钮 添加设备的时候

当我点击添加设备的时候 我上一个ul里面的文字会闪一下，才会变为当前的，感觉应该是复用了，但是不知道怎么解决这个问题

Answer 1

简单的说就是你在打开一个页面的时候，其实已经渲染了一层数据了，在你离开弹框页面时候,你没有清空数据，数据是依然存在的，当然也可以加一个loading，在新数据重新渲染之前把数据loading盖住，增加一个过渡。当然一楼的建议也要采用，最好加上key

Answer 2

vue列表渲染就地复用

大概是这个问题。