Question

vue2.0 里边 v-show里边可以绑定函数吗

Answer 1

问题分析：

在Vue中使用v-show指令来选择性的显示内容。它的属性值可以是布尔值、属性名称以及函数名称。如果使用函数来控制的话，无论函数内容如何运算判断，最终返回布尔值true或者false就可以了。

举例如下：

在以下案例中，将展示使用函数来控制v-show的显示。

HTML代码：

<div id="app">
    <p v-show="func()">{{ message }}</p>
</div>

Vue代码：

var vm = new Vue({
    el: '#app',
    data: {
        message: '默认值'
    },
    methods: {
        func: function(){
            return true;
        }
    }
});

页面初始化结果：

总结：

从运行结果可以看出，页面正确的输出并显示了p元素以及message属性的值。由于在v-show绑定的函数func中最终返回的true，所以它们才得以显示。