javascript - VueJS 中的计算属性

Question

我有一个对象数组:

[
  {
    "value": 4,
    "text": "All Belgium Kendo Federation"
  },
  {
    "value": 33,
    "text": "All United States Kendo Federation"
  },
  // more objects of similar key/value
]

我想创建一个以 id 作为参数的计算属性，这样我就可以获得带有值的文本。

所以，我尝试:

computed: {
        federationSelectedText: function () {

            this.federations.find(function (elt) {
                return elt.value == this.federationSelected;
            });
        }
    },

其中 this.federationSelect 是值。

在 HTML 中 {{ federationSelectedText }}

我调试了变量，this.federations 和 this.federationSelected 都有正确的值

它不显示任何内容，我做错了什么？

Answer 1

您需要返回value并绑定(bind)this以进行find

computed: {
        federationSelectedText: function () {

            return this.federations.find(function (elt) {
                return elt.value == this.federationSelected;
            }.bind(this));
        }
    }

获取一个变量:

computed: {
            federationSelectedText: function () {

                var value = this.federations.find(function (elt) {
                    return elt.value == this.federationSelected;
                }.bind(this));

                return value ? value.text : '';
            }
        }