tomtaw-table

医网云table和查看图片组件

该组件主要用于 传入table对应的prop 来展示 table 列表 还有查看查看图片组件 点击图片列表里面的某张图片时 可以查看相应的图片 且可以点击上一张或下一张按钮 进行切换查看

安装

npm install tomtaw-table

或者

yarn add tomtaw-table

使用 table 组件时

在 main.js 里面 需要
import tomtawTable from "tomtaw-table"
Vue.use(tomtawTable)

在vue 文件里面 
// <simpleTable :propData="propData"></simpleTable>
// propData: [
//   { prop: "user_name", label: "姓名", width: 100 },
//   { prop: "nick_name", label: "昵称", width: 100 },
// ]

使用 查看图片组件watchImg 时

在vue 文件里面 
import { beganShowWatchDialog } from "tomtaw-table"
// 传入3个参数  第一个是 图片列表; 第二个是当前图片的src; 第三个是当前的图片是第几张(索引)
beganShowWatchDialog(
  [
    {src:'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'},
    {src: 'https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg'}
  ],
  'https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg',
  1
)

使用 查看图片轮播组件mySwiper时

在 main.js 里面 需要
import tomtawTable from "tomtaw-table"
Vue.use(tomtawTable)

在vue 文件里面 
//<mySwiper :list="list" :duration="3000" :autoPlay="true"/>
  // list: [
  //   { id: 1, imgUrl: 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg' },
  //   { id: 2, imgUrl: 'https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg' },
  //   { id: 3, imgUrl: 'https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg' },
  //   { id: 4, imgUrl: 'https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg' },
  //   { id: 5, imgUrl: 'https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg' }
  // ]

使用 无缝滚动seamlessScroll插件有关的组件时

在 main.js 里面 需要
import tomtawTable from "tomtaw-table"
Vue.use(tomtawTable)

在vue文件里面
1. chart图表 滚动组件:
  <chartScroll></chartScroll>
2. 文本在div里面滚动组件:
  <contentScroll></contentScroll>
3. 多个div 滚动组件
  <divScroll></divScroll>
4. el-table表格 滚动组件
  <tableScroll></tableScroll>