vue 表格滚动 浏览器缩放到 90% 不会循环滚动了

Vue 中的表格滚动通常依赖于 CSS 和 JavaScript 的交互。当浏览器缩放至小于 100% 的时候，元素的大小可能会相应缩小，这可能导致原本能够连续滚动的表格视图不再响应滚动条操作。这是因为浏览器窗口的视口变小，而表格的高度不变，超出的部分可能不会完全显示出来。

解决这个问题的一个常见做法是为表格设置 `overflow-y` 属性，并在需要的情况下调整表格的宽度或高度，使其适应不同的屏幕尺寸和缩放比例。你可以尝试以下几种方法：

1. 使用响应式布局：在CSS中，可以使用媒体查询 (media query) 来针对不同的视口大小调整表格样式。例如：

   table {
     width: 100%;
     max-width: 100%; /* 添加这个属性限制最大宽度 */
     overflow-y: auto;
   }

   @media (max-width: 768px) { /* 调整的最小宽度，你可以自定义 */
     table {
       height: auto; /* 如果内容不是固定高度，可以让它自动填充 */
     }
   }

2. 给表格容器添加滚动监听事件，根据窗口大小动态调整滚动行为：

   new Vue({
     el: '#table-container',
     data: {},
     mounted() {
       window.addEventListener('resize', this.updateScroll);
     },
     methods: {
       updateScroll() {
         const container = document.querySelector('#table-container');
         if (container.clientWidth < container.scrollHeight) {
           // 当宽度小于高度时启用滚动
           container.style.overflowY = 'auto';
         } else {
           // 否则禁用滚动
           container.style.overflowY = '';
         }
       }
     },
     destroyed() {
       window.removeEventListener('resize', this.updateScroll);
     }
   });

记住，实际应用中可能还需要考虑其他因素，比如滚动性能优化、滚动区域计算等。当你遇到具体问题时，可以提供更多的代码片段以便分析。