1.1.0 • Published 11 months ago

terminal-h5-components v1.1.0

Weekly downloads
-
License
-
Repository
-
Last release
11 months ago

Terminal H5 Components

安装

使用 npm 安装:

npm install terminal-h5-components

使用

按需引入组件 如果你只需要引入特定的组件,例如 CTable:

import { CTable } from 'terminal-h5-components'

// 使用 CTable 组件

引入整个库 如果你想引入整个组件库:

import TerminalH5Components from 'terminal-h5-components'

table 组件

API
  • columns (Array): 表格列的配置数组,每个列对象包含以下属性:

    • dataIndex (String): 列数据在数据项中对应的 key。
    • title (String): 列标题。
    • slotScope (String, 可选): 插槽名称,用于自定义列内容。
    • ellipsis (Boolean, 可选): 是否显示省略号。
    • width (Number, 可选): 列宽度。
    • key (String, 可选): 列的唯一标识。
  • dataSource (Array): 表格数据源数组。

  • rowKey (String): 表格行的唯一标识字段。

  • total (Number): 数据总条数。

  • pageType (String, 可选): 翻页方式 默认scroll 滚动翻页,可配置button为分页导航器

  • rowHeight (Number, 可选): 行高,默认值为 getRelativeSizeBasedOnWidth(66)

  • checkable (Boolean, 可选): 是否显示复选框,默认值为 false

  • loading (Boolean, 可选): 是否显示加载状态,默认值为 false

事件
  • load (Function): 加载更多数据时触发,参数为 pageNumpageSize

  • check (Function): 复选框状态变化时触发,参数为选中的数据数组。

示例
<template>
  <table-component
    :columns="columns"
    :dataSource="dataSource"
    rowKey="id"
    pageType="scroll"
    :total="total"
    :checkable="true"
    :loading="loading"
    @load="handleLoad"
    @check="handleCheck"
  />
</template>

<script setup lang="ts">
import { ref } from 'vue'
import TableComponent from '@/components/table/index.vue'

const columns = [
  { dataIndex: 'name', title: '姓名' },
  { dataIndex: 'age', title: '年龄' },
  { dataIndex: 'address', title: '地址' },
]

const dataSource = ref(
  Array.from({ length: pageSize }, (v, i) => {
    return { id: pageSize * i, name: '张三', age: 22, address: '北京' }
  }),
)

const total = ref(100)
const loading = ref(false)

function handleLoad(pageNum: number, pageSize: number) {
  // 加载更多数据的逻辑
}

function handleCheck(selectedRows: any[]) {
  // 处理选中的数据
}
</script>
1.0.2

11 months ago

1.1.0

11 months ago

1.0.1

11 months ago

1.0.0

11 months ago

0.0.10

11 months ago

0.0.11

11 months ago

0.0.12

11 months ago

0.0.13

11 months ago

0.0.14

11 months ago

1.0.3

11 months ago

0.0.15

11 months ago

0.0.9

11 months ago

0.0.8

11 months ago

0.0.7

11 months ago

0.0.6

11 months ago

0.0.5

11 months ago

0.0.4

11 months ago

0.0.3

11 months ago

0.0.2

11 months ago

0.0.1

11 months ago