css - vue的条件渲染名字用字符串拼接失效

问题描述

问 题

如题，
html:

<div id="demo">
    <p v-if="a1">hello</p>
</div>`

var vm = new Vue({
    el: '#demo',
    data: {
        show: true,
        a1:false,
        t:0,
    },
    methods: {
        init:function() {
            vm.t++;
            var n = "a" + vm.t;
            vm.n = true;
            console.log(n);
            console.log(vm.n);
        }
    }
});
vm.init();

打开页面后，p标签没有显示出来，这是为什么？
控制台输出正常：

解决方案

vm.n表示vm对象下面的属性n，你想要操作a1属性，应该是这样的vm[n]。

这篇关于css - vue的条件渲染名字用字符串拼接失效的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！