element-ui表格数据的应用

需求原型
图片描述
需求:对表格date一列,每行都添加一个按钮。点击对应行的按钮,能够获取对应刷新的数据。展现在当前行。整个表格每过10s自动刷新一次。
后端返回数据:table的data为后端

"a0": {
        "id": "#1",
        "log": "repair bug1",
    },
    "b2": {
        "id": "#2",
        "log": "repair bug2",
    }

date的数据this

"date": "2015-6-27"

思路:两个接口的数据。 一个是整个table 的。 一个是单条记录的。 单条记录是合并到 table 里。
获取到date的值都存在一个数据里。在获取table的数据后, 再遍历两个数据。 根据对应的id,合并到值,再渲染到页面上。 spa

核心代码:
获取table表格数据code

const date = '待刷新'
 for (let i in Datas) {
   let data = {
     id: Datas[i].id,
     log: Datas[i].log,
     date: date
   }
   this.dateDatas.forEach(item => {
     if (item.id === Datas[i].id) {
       data.date = item.date
     }
   })
  this.rbData.push(data)
 }

单次点击获取date的数据接口

this.rbData.forEach(item => {
  if (item.id === row.id) {
    row.date = date
  }
})
let dateData = {
  id: row.id,
  date: date
}
this.dateDatas.push(dateData)
相关文章
相关标签/搜索