Question

使用Vue Multiselect，我尝试在我做出选择后发送console.log。我认为它可以通过将它放在watch中起作用，但它不起作用。应该放在哪里。请参阅下面的我的组件。

组件

<template>
  <div>
    <label v-for="topic in topics" class="radio-inline radio-thumbnail" style="background-image: url('http://s3.hubsrv.com/trendsideas.com/profiles/74046767539/photo/3941785781469144249_690x460.jpg')">
      <input type="radio" v-model="internalValue" name="topics_radio" :id="topic.id" :value="topic.name">
      <span class="white-color lg-text font-regular text-center text-capitalize">{{ topic.name }}</span>
    </label>
  </div>
</template>

<script>
export default {
  props: ['value'],
  data () {
    return {
      internalValue: this.value,
      topics: []
    }
  },
  mounted(){
    axios.get('/vuetopics').then(response => this.topics = response.data);
  },
  watch: {
    internalValue(v){
      this.$emit('input', v);
      console.log('topic has been chosen!!!');
    }
  }
}
</script>

Answer 1

它会触发events，所以你可能会抓住它们。

<multiselect ... @select="doSomething" ...>

然后添加你的方法

...
methods: {
    doSomething(selectedOption, id) {
        console.log(selectedOption);
    }
}

确保正确实现了vue-multiselect，我没有在代码中看到该组件。

Vue Multiselect：如何在选择后发送console.log

1 个答案: