@invex
Верстаю

Как сделать чтобы при переключении checkbox, он прибавлял какое-то значение к переменной?

Просто то как я пытаюсь это сделать как в примере ниже не работает
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<div id="app">
    <input type="number" v-model.number="test1">
    <input type="number" v-model.number="test2">
    <input type="checkbox" v-model="addCheckbox" v-on:change="add()"> +
    
    <button v-on:click="calc() , add()">Ok</button>
    <span>total:{{total}}</span>

</div>
    


<script src="https://unpkg.com/vue@next"></script>
<script src="main.js"></script>
</body>
</html>

Vue.createApp({
    data(){
        return{
            test1: '',
            test2: '',
            total:'',
            all:'',
            addCheckbox: true,
        }
    },
    methods:{
        calc(){
           
            this.all = this.test1 * this.test2;
                       
        },
        add(){
            switch (this.addCheckbox) {
                case true:
                    
                    this.total = this.all + 1000;

                    break;
            
                case false:

                    this.total = this.all - 1000;

                    break;
            }
        }
        
    }


        
}).mount('#app');
  • Вопрос задан
  • 45 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега Vue.js
Сделайте total вычисляемым свойством:

computed: {
  total() {
    return this.value1 * this.value2 + this.checkbox * 1000;
  },
},
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы