1. use the el-table render-header custom header to nest el-dropdown in the header. The click event of the drop-down menu cannot trigger

command is an event of el-dropdown. The callback of the event triggered by clicking on the menu item
code is as follows. Using the JSX syntax, the menu has been rendered, but the click does not respond. Is it possible that the event cannot be written in this way

  <el-table :data="tableData"  style="width: 100%">
                  <el-table-column  prop="date"  label=""  sortable  width="180">
                  </el-table-column>
                  <el-table-column  prop="name"  label=""  sortable  width="180">
                  </el-table-column>
                  <el-table-column  prop="address"  label="" sortable @sort-method="byPost">
                  </el-table-column>
                  <el-table-column :render-header="renderEmotionValue" prop="address">
                    <template slot-scope="scope">
                      <span>{{scope.row.address}}</span>
                    </template>
                  </el-table-column>
              </el-table>

method section:

 renderEmotionValue(creatElement, { column, $index }) {
      return (
        <el-dropdown command={this.handleCommand }>
          <span class="el-dropdown-link">
          <i class="el-icon-arrow-down el-icon--right"></i>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="a" ></el-dropdown-item>
            <el-dropdown-item command="b"></el-dropdown-item>
            <el-dropdown-item command="c"></el-dropdown-item>
            <el-dropdown-item command="d"></el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      )
    },
    handleCommand(command) {
      console.log(command)
      this.$message("click on item " + command)
    }