Vuejs - вычисляемое свойство, основанное на другом вычисляемом свойстве

Question

Я пытаюсь получить вычисляемое свойство из другого вычисляемого свойства, например так:

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

Это не работает. Я получаю «NaN» в моем шаблоне, когда я пытаюсь отобразить plus. Есть ли способ сделать эту работу? Ответ на этот вопрос у меня не работает.

Answer 1

Вы пытаетесь получить доступ к полю length типа number.

this.len - это число, поэтому this.len.length не определено. вам просто нужно использовать 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 свойство в компоненте должно быть функцией, поэтому в вашем случае оно должно быть записано так:

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