2

名前を表示するコンポーネントがあります。各名前の文字数を計算する必要があります。計算されたプロパティとして追加しましnameLengthたが、vuejs はループ内でこのプロパティを決定しません。

var listing = Vue.extend({
    template: '#users-template',
    data: function () {
        return {
            query: '',
            list: [],
            user: '',
        }
    },
    computed: {
        computedList: function () {
            var vm = this;
            return this.list.filter(function (item) {
                return item.toLowerCase().indexOf(vm.query.toLowerCase()) !== -1
            })
        },
        nameLength: function () {
            return this.length; //calculate length of current item
        }
    },
    created: function () {
        this.loadItems();
    },
    methods: {
        loadItems: function () {
            this.list = ['mike','arnold','tony']
        },
    }
});

http://jsfiddle.net/apokjqxx/22/

だから結果が期待される

マイク-4

アーノルド-6

トニー-4

4

1 に答える 1

0

計算されたプロパティについて誤解があるようです。フィドルからフォークを作成しました。必要に応じて機能します。

http://jsfiddle.net/6vhjq11v/5/ 

nameLength: function () {
    return this.length; //calculate length of current item
}

コメントでは、「現在のアイテムの長さを計算する」ことを示していますが、jsは現在のアイテムの概念を取得できません

this.length

これは、その値ではなく Vue コンポーネント自体で長さを実行します。

計算されたプロパティは、インスタンスの他のプロパティで機能し、値を返します。

しかし、ここでは何も指定しておらず、これを使用しているため、プロパティを使用できません。

さらに情報が必要な場合は、コメントしてください。

于 2016-11-04T06:32:54.307 に答える