#javascript #vue.js #vuejs2 #vue-component
#javascript #vue.js #vuejs2 #vue-компонент
Вопрос:
Мне нужно вычислить сумму computed
свойств, которая начинается со calculateSum
строки.
Я не уверен, как это сделать, поскольку я не могу получить их имена с помощью this.computed
Итак, мой метод / попытка:
getSubTotal(){
var computed_names = [];
var computed_names_filtered = computed_names.filter(x => {return x.startsWith('calculateSum')})
return _.sum(computed_names_filtered.map(x => eval(x '()'))
}
Вы знаете, как это сделать?
Ответ №1:
Возможно, это поможет вам получить список вычисляемых:
this.$options.computed
Ответ №2:
Вы можете получить к ним доступ динамически, используя this['computed_name']
метод доступа с использованием скобок, поскольку экземпляр компонента является объектом :
var computed_names = Object.keys(this);
var computed_names_filtered =
computed_names.filter(x => {return x.startsWith('calculateSum')})
_.sum(computed_names_filtered.map(x => this[x]))
Обратите внимание, что вычисляемое свойство вызывается без ()
, но если вы хотите вызвать метод, который вы могли бы сделать this['method_name']()
Пример:
// ignore the following two lines, they just disable warnings in "Run code snippet"
Vue.config.devtools = false;
Vue.config.productionTip = false;
new Vue({
el: '#app',
computed: {
op1() {
return 1;
},
op2() {
return 2;
},
op3() {
return 23;
},
total() {
return ['op1', 'op2', 'op3'].map(o => this[o]).reduce((acc, curr) => acc = curr, 0)
}
},
})
<link type="text/css" rel="stylesheet" href="//unpkg.com/bootstrap/dist/css/bootstrap.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>
<div id="app" class="container">
{{total}}
</div>