vue.js - 如何在 vuetify2 中使用 v-simple-table 构建自动播放滚动表?
问题描述
我想用 vuetify 的 v-simple-table 构建一个自动播放滚动表,我该怎么做?
<v-simple-table class="table" dense :dark="dark">
<template v-slot:default>
<thead>
<tr>
<th v-for="(header, index) in headers" :key="index">
{{ header.text }}
</th>
</tr>
</thead>
<tbody @mouseover="stopScroll" @mouseleave="scroll">
<tr
v-for="(item, index) in showItems"
:key="index"
:class="{ lighten: index % 2 === 1 }"
>
<template v-for="(header, index) in headers">
<td>
<!-- 设置最小宽度 -->
<v-responsive :min-width="getTdMinWidth(header)">
<!-- 设置最大宽度的处理 -->
<div
:class="{
'long-text': isTdTextTooLong(item[header.value])
}"
>
{{ item[header.value] }}
</div>
</v-responsive>
</td>
</template>
</tr>
</tbody>
</template>
</v-simple-table>
就像这个页面的效果:http: //datav.jiaminghi.com/demo/construction-data/index.html
解决方案
推荐阅读
- sql - 从父节点xml sql server检索所有子节点
- angular - Angular 可以像 AngularJS 一样与任何 html 支持技术一起使用吗
- powershell - 注册表路径上的测试路径返回不同的值
- git - git:仅跟踪由数千个小文件组成的大量 repo
- sql-server - 如何在 SQL Server 中所有行的顶部显示所有列“总计”行的总和?
- node.js - _Router2.default.computeRootMatch 不是函数
- c# - 忽略或跳过提供“未经授权访问”“具有功能 Directory.GetDirectories()”的文件夹
- android - 无法导入 com.firebase.ui.auth.ResultCodes
- python - 如何从数据框(熊猫)打印特定值(字符串)的数据
- c# - EPPlus 条件格式