真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

小程序不支持table標(biāo)簽的解決方法

這篇文章主要介紹小程序不支持table標(biāo)簽的解決方法,文中介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們一定要看完!

創(chuàng)新互聯(lián)建站主打移動網(wǎng)站、成都網(wǎng)站制作、成都網(wǎng)站設(shè)計、外貿(mào)營銷網(wǎng)站建設(shè)、網(wǎng)站改版、網(wǎng)絡(luò)推廣、網(wǎng)站維護、域名注冊、等互聯(lián)網(wǎng)信息服務(wù),為各行業(yè)提供服務(wù)。在技術(shù)實力的保障下,我們?yōu)榭蛻舫兄Z穩(wěn)定,放心的服務(wù),根據(jù)網(wǎng)站的內(nèi)容與功能再決定采用什么樣的設(shè)計。最后,要實現(xiàn)符合網(wǎng)站需求的內(nèi)容、功能與設(shè)計,我們還會規(guī)劃穩(wěn)定安全的技術(shù)方案做保障。

小程序不支持table標(biāo)簽怎么辦

小程序不支持table標(biāo)簽,但是可以使用css的display: table;來實現(xiàn)表格樣式。

推薦學(xué)習(xí):小程序開發(fā)

具體實現(xiàn)如下:

1、通過設(shè)置js里面的數(shù)組對象格式模擬動態(tài)后臺獲取的數(shù)據(jù),然后將數(shù)組對象內(nèi)容以三個元素為一組組成數(shù)組對象格式再合并成一個新的數(shù)組對象格式,之所以這樣做就是為了,一行有三個單元格設(shè)計的:

Page({
  data: {
    tableData: [{ //模擬動態(tài)獲取到的后臺數(shù)據(jù):數(shù)組對象格式
        id: 0,
        name: 'table-th-cell'
      },
      {
        id: 1,
        name: 'table-th-cell'
      },
      {
        id: 2,
        name: 'table-th-cell'
      },
      {
        id: 3,
        name: 'table-tr-cell'
      },
      {
        id: 4,
        name: 'table-tr-cell'
      },
      {
        id: 5,
        name: 'table-tr-cell'
      },
      {
        id: 6,
        name: 'table-tr-cell'
      },
      {
        id: 7,
        name: 'table-tr-cell'
      },
      {
        id: 8,
        name: 'table-tr-cell'
      },
    ],
    threeArray: '', //模擬將后臺獲取到的數(shù)組對象數(shù)據(jù)按照一行3個的單元數(shù)據(jù)的格式切割成新的數(shù)組對象(簡單的說:比如獲取到數(shù)組是9個元素,切分成,3個元素一組的子數(shù)組)
  },
  onLoad: function() {
    let that = this;
    let threeArray = [];
    // 使用for循環(huán)將原數(shù)據(jù)切分成新的數(shù)組
    for (let i = 0, len = that.data.tableData.length; i < len; i += 3) {
      threeArray.push(that.data.tableData.slice(i, i + 3));
    }
    console.log(threeArray);
    that.setData({
      threeArray: threeArray
    })
  },
})

2、設(shè)置wxml:


  

    
      
        {{item.name}}
      
    
    
      
        {{item.name}}
      
    
  

3、設(shè)置wxss:

.table {
  display: table;
  width: 100%;
  /* border-collapse 屬性設(shè)置表格的邊框是否被合并為一個單一的邊框,解決相鄰單元格邊框未合并導(dǎo)致有些邊框變粗的視覺效果 */
  border-collapse: collapse;
  overflow-x: hidden;
}
.table-tr {
  display: table-row;
  width: 100%;
  height: 200rpx;
}
.table-th {
  display: table-cell;
  font-weight: bold;
  border: 1px solid black;
  text-align: center;
  vertical-align: middle;
  background-color: #ccc;
}
.table-td {
  display: table-cell;
  border: 1px solid black;
  text-align: center;
  vertical-align: middle;
}

效果如下:

小程序不支持table標(biāo)簽的解決方法

以上是“小程序不支持table標(biāo)簽的解決方法”這篇文章的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對大家有幫助,更多相關(guān)知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!


分享文章:小程序不支持table標(biāo)簽的解決方法
URL分享:http://weahome.cn/article/pdecci.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部