Почему я не могу использовать постоянное число вместо this.item.number? - PullRequest
1 голос
/ 01 февраля 2020

<template>
    <Page>
        <ActionBar title="item" />
        <ScrollView>
            <StackLayout>
                <Label textWrap="true" v-for="n in times" :text="n" />
            </StackLayout>
        </ScrollView>
    </Page>
</template>

<script>
    export default {
        props: ["item"],
        data() {
            return {
                times: this.item.subTotal - this.item.subtrackfromTotal // OK
                // times: 9 - 5, // OK
                // times: this.item.subTotal - 5 //error: INVALID ARRAY LENGTH
            };
        }
    };
</script>

Я хочу вычесть 5 из (числовое поле моих данных) и => использовать его в v-for="n in times", но когда я использую постоянное число , например, 5 , выдает ошибку недопустимой длины массива.

Почему не получается times: this.item.subTotal - 5?

Пожалуйста, помогите мне разобраться; как использовать операторы над моими данными и постоянными числами, и в то же время заставить vue считать, что я посылаю постоянное число, а не массив?

Когда я пытался times: this.item.subTotal - this.item.subtrackfromTotal или times: 9 - 5Vue принимает раз как постоянное число. Но когда я пытаюсь times: this.item.subTotal - 5 Это дает ошибку недействительной длины массива.

Спасибо за ваши ответы заранее.


Пожалуйста, проверьте код на {N} Playground

Игровая площадка "Изменение количества (номер элемента - 5)"

1 Ответ

1 голос
/ 01 февраля 2020

Вы получаете эту ошибку, потому что значение отрицательное.

Для одного из ваших элементов значение this.item.subTotal равно 4, поэтому times равно -1.

new Vue({
  el: '#app',
  
  data () {
    return {
      times: -1
    }
  }
})
<script src="https://unpkg.com/vue@2.6.11/dist/vue.js"></script>

<div id="app">
  <div v-for="a in times"></div>
</div>

То, как вы это исправите, зависит от того, какое поведение вы хотите в этом случае. Может быть, это?

times: Math.max(0, this.item.subTotal - 5)
...