Element-UI ( Dropdow )下拉菜单组件command传输对象

Posted 2021-03-09 nayek

通过 :command绑定对象数据,handleCommand方法处理数据

template

<div  v-for="(item, index) in FlyWarningList" :key="index">
          <div :class="[isActive === item.isRead ? '':' warning-content', 'first-content']" v-if="item.infoType === '告警信息'">
            <p class='content-item infoType'>{{item.infoType}}</p>
            <p class='content-item'>注册编号：{{item.content.rescueNum}}</p>
            <p class='content-item'>紧急阶段：{{item.content.phase}}</p>
            <p class='content-item'>降落机场：{{item.content.landingStation}}</p>
            <p class='content-item'>备降机场：{{item.content.alternateAirport}}</p>
            <p class='content-item'>最后联系时间：{{item.content.lastContactTime}}</p>
            <p class='content-item'>最后联系位置：{{item.content.lastContactLocation}}</p>
            <div class='publish-time'>发布时间：{{item.sendTime}}</div>
            <el-dropdown class='content-menu' trigger="click"  @command="handleCommand">
              <span class="el-dropdown-link">
                <i class="el-icon-arrow-down"></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item :command="item">已读</el-dropdown-item>
                <el-dropdown-item command="delete">删除</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>
</div>

methods

 handleCommand (command) {
      this.$message({
        message: '消息已读',
        type: 'success'
      })
      console.log('sendTime11111', command.sendTime)
      console.log('command================2', JSON.stringify(command))
      var data = {
        type: command.type,
        count: command.count,
        active: command.active,
        isRead: false,
        messageNumber: command.messageNumber,
        infoType: command.infoType,
        infoUid: command.infoUid,
        sendTime: command.sendTime,
        content: command.content
      }
      this.$http.get('/seat/read', {
        params: {
          message: data
        }
      })
        .then((res) => {
          console.log('■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■')
          console.log('res:', res)
          console.log('■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■')
          console.log(res.data)
          if (res.data === '状态改变成功') {
            command.isRead = false
            console.log('active', command.isRead)
            console.log('sendTime2222', command.sendTime)
          }
        }).catch((err) => {
          console.log('请求失败■■■■■■■■■■■■■■' + err)
        })
      if (command === 'edit') {
        this.$emit('toggleModal', this.activeName)
      }
    }