Javascript Vue 2.0:家长未响应子事件

我有一个侧边栏子组件，其中包含更改选项卡的按钮：

<script type="text/x-template" id="employee-sidebar">
    <div class="sidebar full-height col-" data-color="purple">
        <div class="sidebar-wrapper" id="dash-board">
            <ul class="nav">
                <li v-bind:class="{ active: activeLink == 'dashboard' }">
                    <a href="#dashboard" @click="changeTab('dashboard')">
                        <i class="material-icons">dashboard</i>
                        <p>Dashboard</p>
                    </a>
                </li>
                <li v-bind:class="{ active: activeLink == 'team' }">
                    <a href="#radio" @click="changeTab('team')">
                        <i class="fa fa-users"></i>
                        <p>Team</p>
                    </a>
                </li>
                <li class="text-center"><button class="btn btn-primary clear-filter">Clear</button></li>
            </ul>
        </div>
    </div>
</script>

当我调用父级中的组件时，我将侦听此事件：

<employee-sidebar v-on:changeTab="changeTheTab(activeLink)"></employee-sidebar>

---

我做错了什么？

感谢@wostex提供的小写提示，我能够将我的组件更新为以下内容：

Vue.component('employee-sidebar', {
  template: '#employee-sidebar',
  props: {},
  data: function() {
    return {
      activeLink: 'dashboard'
    }
  },
  methods: {
    changeTab: function(tab) {
      console.log(tab)
      this.activeLink = tab
      this.$emit('change_tab', tab)
    }
  }
})

在家长中：

changeTheTab: function(tab) {
  // Never see this console log
  console.log(tab)
  this.activeLink = tab
}

<employee-sidebar v-on:change_tab="(tab) => activeLink = tab"></employee-sidebar>

试试

v-on:changeTab=“changetetab”

，您不需要传入参数，让您的事件名称全部小写-它将修复您的错误。HTML不区分大小写。这是可行的，但我似乎无法传递父级中所需的tab参数

<employee-sidebar v-on:change_tab="(tab) => activeLink = tab"></employee-sidebar>