table高度固定_html5table-大创和国创是一个东西吗

table高度固定_html5table移动端高度自定义表格插件_移动端表格组件

移动端高度自定义表格插件

用了很多的移动端table组件都挺不错的 但是对于表格样式上的改动是在不方便，所以就自己写一个移动的表格组件出来，方便后面的时候 也能提供一些开发思路开源鉴赏一下。

源码地址: lyz-table

效果图
1.可自定义行样式 列表样式

2.固定表头 固定列

3.带边框样式表格

lyz-table 插件使用方式

移动端高度自定义表格组件

组件名：lyz-table

用于展示移动端高度自定义表格

平台差异说明

目前仅支持 vue2 移动端

组件使用注意事项

为了避免错误使用，给大家带来不好的开发体验，请在使用组件前仔细阅读下面的注意事项，可以帮你避免一些错误。

安装方式

npm i --save lyz-table或yarn add lyz-table

希望我今天分享的这篇文章可以帮到您。

基本用法

// main.js 注册全局import lyzTable from 'lyz-table'Vue.use(lyzTable)

API

lyzTable Props

lyzTable Slot

lyzTable Columns

需要注意的是

columns 中的 style 默认是当前列生效（列头和列） 可以配置 columnStyle 来覆盖列头所产生的样式影响

lyzTable Examples

<template>  <p ><lyzTable style="padding: 0 34px 0 24px;" :columns="groupColumns" :list="groupList">  <template slot="nodata">暂无数据</template></lyzTable> </p></template><script>export default {  data () {    return {groupList: [{        statTime: '111',        groupTotal: 11,        groupInc: 222,        groupCustomTotal: 2223,        groupCustomInc: 43,        groupCustomDec: 12      }, {        statTime: '111',        groupTotal: 11,        groupInc: 222,        groupCustomTotal: 2223,        groupCustomInc: 43,        groupCustomDec: 12      }, {        statTime: '111',        groupTotal: 11,        groupInc: 222,        groupCustomTotal: 2223,        groupCustomInc: 43,        groupCustomDec: 12      }, {        statTime: '111',        groupTotal: 11,        groupInc: 222,        groupCustomTotal: 2223,        groupCustomInc: 43,        groupCustomDec: 12      }, {        statTime: '111',        groupTotal: 11,        groupInc: 222,        groupCustomTotal: 2223,        groupCustomInc: 43,        groupCustomDec: 12      }],      groupColumns: [{        title: '日期',        key: 'statTime',        fixed: 'left',        style: {          width: '120px',          color: '#494949',          paddingLeft: '10px',          textAlign: 'center'        },        columnStyle: {          width: '120px',          color: 'pink',        }      },      {        title: '客户群总数',        key: 'groupTotal',        style: {          width: '200px',          color: '#494949'        }      },      {        title: '新增客户群',        key: 'groupInc',        style: {          width: '200px',          color: '#494949'        }      },      {        title: '客户群总人数',        key: 'groupCustomTotal',        style: {          width: '200px',          color: '#494949'        }      }, {        title: '客户群新增人数',        key: 'groupCustomInc',        style: {          width: '200px',          color: '#494949'        }      }, {        title: '退群客户数',        key: 'groupCustomDec',        style: {          width: '200px',          color: '#494949'        }      }      ],}  }} 

该组件由国大创软网络科技有限公司授权开源