我想要一个v-data-table可编辑且看起来“不错”的。
添加 av-text-field使其可编辑也会将行高增加到非常令人不快的水平
原始视图：
使用 v-text-field 输入
如何降低行高以类似于没有v-text-fields.
作为奖励
因为我对整个前端开发类型的事物都很陌生，所以我将如何确定是什么导致了这个“高度问题”？
PS：我尝试添加一个 JSFiddle，但我什至无法弄清楚如何v-data-table正确显示...
基本草稿可以在这里找到
您的表格是否必须在列中可编辑？您如何决定何时通过请求将数据传回后端？用户离开字段后？
如果不需要在表格中使用编辑选项，我会使用表格中已有的操作按钮来触发可以编辑字段的模式。这还允许您在用户提交请求之前进行适当的表单控制。还有一个 Vuetify Codepen 示例如何执行此Codepen
如果有必要，您应该实现v-data-tableas v-data-iterator，它在功能上基本相同，但允许完全控制外观。https://vuetifyjs.com/en/components/data-iterators/
至于如何识别v-text-field高度问题，您必须使用浏览器开发工具。然后您会意识到输入具有默认的填充和边距，但在后台也有很多。例如，它为弹出的错误消息和在字段上方的标签分配空间。
以及如何修复您的 JSfiddle，您可以在 CDN https://vuetifyjs.com/en/getting-started/installation/#usage-with-cdn下的 vuetify 文档的入门部分阅读。
您可以使用“密集”属性来降低v-data-table输入高度