zoukankan      html  css  js  c++  java
  • Element-UI ( Dropdow )下拉菜单组件command传输对象

    通过 :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)
          }
        }
    
    今天你学习了吗!!!
  • 相关阅读:
    视频质量评测标准——VMAF
    净化网络环境!可信数字内容版权服务解决方案发布
    如何用sysbench做好IO性能测试
    云栖专辑|阿里开发者们的第二个感悟:PG大V德哥的使命感与开放心态
    CRI 与 ShimV2:一种 Kubernetes 集成容器运行时的新思路
    阿里巴巴持续投入,etcd 正式加入 CNCF
    阿里系统软件迎战“双11”超高流量峰值全纪录
    从SQL Server CloudDBA 看云数据库智能化
    ls -l 权限后面有个点
    Error File: /admin/app/template.app.php at 285 line.
  • 原文地址:https://www.cnblogs.com/nayek/p/12331643.html
Copyright © 2011-2022 走看看