elementUi行合并

直接上代碼


<template>
  <section>
    <section>
      <el-table
        :data="table"
        :span-method="objectSpanMethod"
        border
        style="width: 100%">
        <el-table-column
          prop="checkRoom"
          label="checkRoom"
          width="180">
        </el-table-column>
        <el-table-column
          prop="checkProject"
          label="checkProject">
        </el-table-column>
        <el-table-column
          prop="checkMoney"
          label="checkMoney">
        </el-table-column>
        <el-table-column
          prop="attention"
          label="attention">
        </el-table-column>
        <el-table-column
          prop="appointmentTime"
          :formatter="dataCh"
          label="appointmentTime">
        </el-table-column>
      </el-table>
    </section>
  </section>
</template>

<script>

export default {
  name: 'meTest',
  components: {  },
  data() {
    return {
      ruleForm : {},
      msg : 'jiang',
      curFilterChannel: null, // 當(dāng)前篩選的channel
      leftWidth: '300px',
      treeIsCollapse: false,
      curActiveNode: {
        lfcode: 'dff'
      },
      table: [{
        id: '1',
        checkRoom: 'CTROOM',
        checkProject: '300.22',
        checkMoney: '300.22',
        attention: '檢查前空腹',
        appointmentTime: ''
      },{
        id: '1',
        checkRoom: 'CTROOM',
        checkProject: '頸椎MRICT1',
        checkMoney: '303.22',
        attention: '檢查前空腹',
        appointmentTime: ''
      },{
        id: '1',
        checkRoom: 'CTROOM',
        checkProject: '頸椎MRICT22',
        checkMoney: '340.22',
        attention: '檢查前空腹',
        appointmentTime: '2019-5-29 10:30'
      },{
        id: '1',
        checkRoom: 'DR',
        checkProject: '鼻骨',
        checkMoney: '500.22',
        attention: '檢查前',
        appointmentTime: '2019-5-29 9:30'
      }]
    }
  },
  created() {
    this.table = this.mergeTableRow(this.table, ['checkRoom', 'attention', 'appointmentTime'])
  },
  methods: {
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      const span = column['property'] + '-span'
      if(row[span]){
          return row[span]
      }
    },
    mergeTableRow(data, merge) {
      if (!merge || merge.length === 0) {
        return data
      }
      merge.forEach((m) => { // 'checkRoom'
        const mList = {}
        data = data.map((v, index) => {
          const rowVal = v[m]
          if (mList[rowVal] && mList[rowVal].newIndex === index) {
            mList[rowVal]['num']++
            mList[rowVal]['newIndex']++
            data[mList[rowVal]['index']][m + '-span'].rowspan++
            v[m + '-span'] = {
              rowspan: 0,
              colspan: 0
            }
          } else {
            mList[rowVal] = { num: 1, index: index, newIndex: index + 1 }
            v[m + '-span'] = {
              rowspan: 1,
              colspan: 1
            }
          }
          return v
        })
      })
      return data
    }
  }
}
</script>

<style lang="less">
</style>
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末才沧,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子挨摸,更是在濱河造成了極大的恐慌岁歉,老刑警劉巖,帶你破解...
    沈念sama閱讀 212,816評(píng)論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件熔掺,死亡現(xiàn)場(chǎng)離奇詭異非剃,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)券坞,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,729評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門(mén)报慕,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)压怠,“玉大人,你說(shuō)我怎么就攤上這事〔伎ǎ” “怎么了雇盖?”我有些...
    開(kāi)封第一講書(shū)人閱讀 158,300評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵崔挖,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我薛匪,道長(zhǎng)脓鹃,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,780評(píng)論 1 285
  • 正文 為了忘掉前任娇跟,我火速辦了婚禮太颤,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘苗胀。我一直安慰自己瓦堵,他們只是感情好歌亲,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,890評(píng)論 6 385
  • 文/花漫 我一把揭開(kāi)白布陷揪。 她就那樣靜靜地躺著,像睡著了一般悍缠。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上滤港,一...
    開(kāi)封第一講書(shū)人閱讀 50,084評(píng)論 1 291
  • 那天溅漾,我揣著相機(jī)與錄音,去河邊找鬼添履。 笑死,一個(gè)胖子當(dāng)著我的面吹牛锐借,可吹牛的內(nèi)容都是我干的往衷。 我是一名探鬼主播,決...
    沈念sama閱讀 39,151評(píng)論 3 410
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼嗅战,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼俺亮!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起东且,我...
    開(kāi)封第一講書(shū)人閱讀 37,912評(píng)論 0 268
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤珊泳,失蹤者是張志新(化名)和其女友劉穎拷沸,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體撞芍,經(jīng)...
    沈念sama閱讀 44,355評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡序无,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,666評(píng)論 2 327
  • 正文 我和宋清朗相戀三年帝嗡,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片哟玷。...
    茶點(diǎn)故事閱讀 38,809評(píng)論 1 341
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖隘竭,靈堂內(nèi)的尸體忽然破棺而出塘秦,到底是詐尸還是另有隱情,我是刑警寧澤动看,帶...
    沈念sama閱讀 34,504評(píng)論 4 334
  • 正文 年R本政府宣布尊剔,位于F島的核電站,受9級(jí)特大地震影響菱皆,放射性物質(zhì)發(fā)生泄漏须误。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,150評(píng)論 3 317
  • 文/蒙蒙 一仇轻、第九天 我趴在偏房一處隱蔽的房頂上張望京痢。 院中可真熱鬧,春花似錦篷店、人聲如沸祭椰。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,882評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至蹄殃,卻和暖如春携茂,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背诅岩。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,121評(píng)論 1 267
  • 我被黑心中介騙來(lái)泰國(guó)打工讳苦, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人吩谦。 一個(gè)月前我還...
    沈念sama閱讀 46,628評(píng)論 2 362
  • 正文 我出身青樓鸳谜,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親逮京。 傳聞我的和親對(duì)象是個(gè)殘疾皇子卿堂,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,724評(píng)論 2 351

推薦閱讀更多精彩內(nèi)容

  • 話(huà)不多說(shuō), 直接上效果圖 這里是未展開(kāi)的表格:image.png 展開(kāi)之后:image.pngimage.png...
    Renkin卡皮巴拉閱讀 4,751評(píng)論 0 0
  • 使用 elementui 做項(xiàng)目的時(shí)候大家應(yīng)該會(huì)遇到很多關(guān)于表格的需求 下面是總結(jié)的兩個(gè)項(xiàng)目中遇到的問(wèn)題. 查看文...
    小椰子表姐閱讀 12,937評(píng)論 4 5
  • ———007er 第12篇成長(zhǎng)日記——— 不管過(guò)去多少年,生命中總有讓你忘不了的人和事懒棉。 ...
    傲雪玫瑰閱讀 697評(píng)論 9 7
  • 今日完成 :) 健康:10:30睡覺(jué) :)身體維護(hù):認(rèn)真吃營(yíng)養(yǎng)品 :)學(xué)習(xí):閱讀1章 :)三只青蛙 1、日常教學(xué) ...
    曲蔓地閱讀 213評(píng)論 0 0
  • 時(shí)間好快览绿,這居然是和王先森共同生活的第七個(gè)年頭……難以想象這個(gè)男人已經(jīng)占據(jù)我生命中三分之一的時(shí)間策严,那天,笑著...
    情戲嫣迷閱讀 55評(píng)論 0 0