javascript - Vue.js v-show 指令 react 性

Question

我有一个带有 v-show 和 v-for 指令的 div，渲染到我的模板中。

由于我需要显示/隐藏每个索引键，因此我在 v-show 函数中传递索引，这迫使我编写方法函数，而不是计算函数。

我的问题是，在某个时刻，我想使用 Vue react 性地显示隐藏的 div，而不需要重新渲染，我将如何实现这一点？

模板

<div
    v-for="(file,index) in cluster.files"
    v-show="showPartialFiles(index)"
    v-bind:key="index"
>

脚本

methods: {
            showPartialFiles: function(index){
                if (index <= this.$store.state.numberOfAssignmentCutoff - 1)
                return true;
            },
    }

附:我用 vanilla/JQuery 编写来完成此任务没有问题，但我想将其与 Vue 一起构建到 Vue 对象中，以便将来实现可扩展性和可重用性。

非常感谢，巴德。

Answer 1

您可以为此使用计算属性，然后 v-show 将对商店中的更改使用react；

computed: {
    showPartialFiles() {
        return (index) => {
            return index <= this.$store.state.numberOfAssignmentCutoff - 1
        }
    }
}