Question

如何在单选按钮上使用$dispatch()或$broadcast()？我不能这样做（因为我不能在单选按钮上使用v-on:click）：

HTML

 <div class="radio radio-primary">
     <label>
         <input type="radio" name="intern" id="intern" value="intern" 
                v-on:click="update" v-model="selectedrole"/>
             Showall
      </label>                          
</div>

JS

Vue.component('searchemployees', {
    template: '#searchemployees',
    data: function()
    {
        return {
            selectedrole: ''
        }
    },
    methods: {
        update: function()
        {
            this.$dispatch('selectedRole', this.selectedrole)
        }
    }
});

Vue.component('employees', {
    template: '#employees',
    props:['list'],
    data: function()
    {
        return {
            role: ''
        }
    },
    created() {
        this.list = JSON.parse(this.list);
    },
    events: {
        'selectedrole': function(role) {
            this.role = role
        }
    }
});

因为我无法在单选按钮上使用v-on:click。我怎样才能做到这一点？（我需要2个组件中的selectrole）。

请帮忙！

Answer 1

您可以使用selectedrole：

在watch更改时广播该事件

Vue.component('searchemployees', {
  template: '#searchemployees',
  data: function()
    {
      return {
        selectedrole: ''
      }
    },
    watch: {
      selectedrole: function(newRole)
      {
        this.$dispatch('selectedRole', newRole)
      }
    }
});

然后只需删除点击监听器，就不需要

Vue.js使用v-on：点击radiobutton

1 个答案: