vm.handleClick не является функцией vue.js - PullRequest
0 голосов
/ 11 июля 2019

Я использую кнопки переключения шаблона аргона: Документы шаблона аргона

И я хочу добавить handleChange на кнопки переключения, но это не работает, вот мой код:

<template>
  <div class="option">
      <div>Show value
          <label class="custom-toggle">
          <input type="checkbox" @click="handleClick($event)">
          <span class="custom-toggle-slider rounded-circle"></span>
          </label>
          <div v-if="viewCheck"> 
           <div>Name </div>
           <div>Surname</div>
          </div>
       </div>
  </div>
</template>

<script>
export default {
  name: 'Options',
  data: function() {
    return {
      viewCheck:false
    }
  },
  handleClick: function(event) {
      console.log(event)
      this.viewCheck = true
  }
}
</script>

Фактически, когда я нажимаю на кнопку переключения, я получаю это сообщение:

TypeError: _vm.handleClick не является функцией
при щелчке (eval at./node_modules/vue-loader/lib/template-compiler/index.js?{"id":"data-v-6f2958af","hasScoped":false,"transformToRequire":{"video":["src»,"плакат"], "источник": "ГКЗ", "IMG": "ЦСИ", "образ": "XLink: HREF"}, "Бабл": { "прообразы": {}}} ./ node_modules /vue-loader / lib / selector.js? type = template & index = 0! ./ src / views / Option.vue
(app.js: 7731),: 22: 34)
в invokeWithErrorHandling (vue.esm.js? efeb: 1863)
в HTMLInputElement.invoker (vue.esm.js? efeb: 2188)
в HTMLInputElement.original._wrapper (vue.esm.js? efeb: 7559)

1 Ответ

2 голосов
/ 11 июля 2019

Вы должны поместить его в methods свойство.

Попробуйте это:

export default {
  name: 'Options',
  data: function() {
    return {
      viewCheck:false
    }
  },
  methods: {
    handleClick: function(event) {
      console.log(event)
      this.viewCheck = true
    }
  }
}
...