水岛 2020-02-05 11:49 采纳率: 12.5%
浏览 1590
已结题

Element ui里面的table如何绑定mysql数据

就是它这个table怎么绑定php绑定mysql的数据额,也没看到有文档

<template>
    <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="date"
        label="日期"
        width="180">
      </el-table-column>
      <el-table-column
        prop="name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="address"
        label="地址">
      </el-table-column>
    </el-table>
  </template>

  <script>
    export default {
      data() {
        return {
          tableData: [{
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄'
          }]
        }
      }
    }
  </script>
  • 写回答

2条回答

  • dabocaiqq 2020-02-05 11:53
    关注
    1.绑定一条数据用: => slot-scope属性,再显示对应的数据
    通过 Scoped slot 可以获取到 row, column, $index 和 store(table 内部的状态管理)的数据:
    {{scope.row}} =>获取整行的数据
    {{scope.$index}} => 行的下标
    使用:
    <el-table <el-table-column
    <template slot-scope="scope">
    {{ scope.row.userSex === 1 ? "男" : "女" }} </template>
    
    /el-table-column>
    /el-table>
    2.只绑定一个数据,例如:sex:'女'
    <ui-table-column prop="userSex" label="性别" width="80px" :formatte r="getSexType" show-overflow-tooltip> </ui-table-column>
    再通过formatter属性来格式化数据(定义没有数据的显示内容)如下:
    getSexType(row, column) { return sexType(row[column.property]) }
    row[column.property] => 获取表格里数据
    sexType => 定义的公共方法(逻辑)
    
    评论

报告相同问题?

悬赏问题

  • ¥15 使用phpstudy在云服务器上搭建个人网站
  • ¥15 应该如何判断含间隙的曲柄摇杆机构,轴与轴承是否发生了碰撞?
  • ¥15 vue3+express部署到nginx
  • ¥20 搭建pt1000三线制高精度测温电路
  • ¥15 使用Jdk8自带的算法,和Jdk11自带的加密结果会一样吗,不一样的话有什么解决方案,Jdk不能升级的情况
  • ¥15 画两个图 python或R
  • ¥15 在线请求openmv与pixhawk 实现实时目标跟踪的具体通讯方法
  • ¥15 八路抢答器设计出现故障
  • ¥15 opencv 无法读取视频
  • ¥15 按键修改电子时钟,C51单片机