javascript - 使用 Vue.js 的可滚动表格

Question

所以我有一个使用 vue.js v-for 方法填充的表:

<table>
  <tr><th>Name</th><th>Surname</th></tr>
  <tr v-for="user in users"><td>@{{user.name}}</td><td>@{{user.surname}}</td></tr>
</table>

我需要这个表格的最大高度为 300px，如果它变长，它就可以滚动。

所以基本上我需要在我的 css 中设置 max-height 和 overflow:auto 参数，但问题是代码没有正确地“看到”这个表因为它是用vue渲染的。

到目前为止，我只是尝试在 css 中添加参数并在加载表格后动态添加它们；这些都不起作用。

但是，如果我调用 $('table').height()，它会返回渲染表格的实际高度。也许我可以以某种方式使用它？

非常感谢任何可能的帮助!

Answer 1

你能把 table 包在 <div> 里吗？ ？

通过这种方式，div 可以控制滚动，表格可以按照自己的方式自由移动。