как я могу вернуть обновленное значение переменной из метода Vue Cli - PullRequest
Новая
       8

как я могу вернуть обновленное значение переменной из метода Vue Cli

0 голосов
/ 23 июня 2018

Я написал код для увеличения и уменьшения значения, используя методы vue cli, но методы ничего не возвращают.Но значения по умолчанию печатаются на HTML, как я могу получить значение метода также. 

----------
//html
<div class="col-sm-4">
                <div class="counter">
                <center>Adults</center>
                <div class="row"> 
                  <div class="col-sm-1">
                    <span class="fas fa-minus" v-on:click="adec"></span>
                  </div>
                  <div class="col-sm-10">
                    <center>{{adult}}</center>
                  </div>
                  <div class="col-sm-1">
                    <span class="fas fa-plus"  v-on:click="ainc"></span>
                  </div>
                </div>
              </div>
              </div>
----------
vue.js code 

<script>
export default {
  data () {
    return {
      msg: 'Welcome to Your Vue.js App',
      adult:1,
    }
  },
  methods:{
    ainc(){
     this.adult++;
    },
    adec(){
     this.adult--;
    },
  }
}
</script>

1 Ответ

0 голосов
/ 23 июня 2018

Я не уверен, поможет ли это, но дайте мне знать, если это поможет: 

<template>
  <div class="pt-5">
    <div class="row">
      <div class="col-sm-4">
        <button v-on:click="adec">minus</button> adult: {{adult}} | adec(): {{ainc()}}
      </div>
      <div class="col-sm-4">
        <button v-on:click="ainc">plus</button> adult: {{adult}} |  ainc(): {{adec()}}
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      msg: 'Welcome to Your Vue.js App',
      adult: 1,
    };
  },
  methods: {
    ainc() {
      this.adult += 1;
      return this.adult;
    },
    adec() {
      this.adult -= 1;
      return this.adult;
    },
  },
};
</script>
...