Vuejs - 基于其他计算属性的计算属性

Question

I'm trying to get a computed property from another computed property, like so:

var instance = new Vue({
    el: "#instance",
    data: {
        aha: ""
    },
    computed: {
        len: function(){
            return this.aha.length;
        },
        plus : function(){
            return this.len + 2;
        }
    }
});

This doesn't work. I get NaN in my template when I try to display plus . Is there a way to make this work? The answer to this question doesn't work for me.

Answer 1

You are trying to access the length field of type number .

this.len is number, so this.len.length is undefined. you just need to use this.len :

var instance = new Vue({
    el: "#instance",
    data: {
        aha: ""
    },
    computed: {
        len: function(){
            return this.aha.length;
        },
        plus : function(){
            return this.len+ 2;
        }
    }
});

Answer 2

data property in component must be a function, so in your case it should be written like this:

data () {
 return {
   aha: ""
 }
}