v-for使用动态变量

使用计算属性或方法来动态生成需要遍历的数据

示例代码：

<template> <div> <ul> <li v-for="(item, index) in list" :key="index"> {{ item }} </li> </ul> <button @click="changeList">改变列表</button> </div> </template>

<script> export default { data() { return { dynamicVariable: "list1", list1: ["A", "B", "C"], list2: ["1", "2", "3"], }; }, methods: { changeList() { this.dynamicVariable = this.dynamicVariable === "list1" ? "list2" : "list1"; }, }, computed: { list() { return this[this.dynamicVariable]; }, }, }; </script>

在该示例中，动态变量dynamicVariable存储了当前需要遍历的数据，computed属性list根据该变量的值动态生成需要遍历的数据。在方法changeList中，根据业务逻辑动态切换dynamicVariable的值，实现动态切换需要遍历的数据。