【问题标题】:How to catch scrolling event on v-data-table component?如何捕获 v-data-table 组件上的滚动事件?
【发布时间】:2021-10-30 07:34:50
【问题描述】:

有没有办法在 Vuetify frmework 的 v-data-table 组件上捕获滚动事件?

我的意思是表格具有固定高度的情况,因此表格主体会滚动。

<v-data-table
  fixed-header
  :height=400
  :headers="headers"
  :items="desserts"
  item-key="name"
  disable-pagination
  hide-default-footer
></v-data-table>

https://codepen.io/Zurab-D/pen/yLXOyRJ

【问题讨论】:

    标签: javascript vue.js vuetify.js v-data-table


    【解决方案1】:

    代码如下:

    new Vue({
      el: '#app',
      vuetify: new Vuetify(),
      data: () => ({
        desserts: Array.from({ length: 5000 }).map((v, k) => ({
            name: `#${k}`,
            calories: 518,
        })),
        headers: [
          { text: 'Dessert', value: 'name' },
          { text: 'Calories', value: 'calories' },
        ],
      }),
      mounted() {
        document.addEventListener('wheel', this.onScroll)
      },
      methods: {
        onScroll : function(){
          console.log('scroll')
        }
      }
    })
    

    【讨论】:

    • 我的意思是这个组件必须有一个内置的方法。但是如果没有,那么这个方法也很好,谢谢
    猜你喜欢
    • 1970-01-01
    • 2020-01-21
    • 2020-02-29
    • 2021-04-16
    • 2012-05-02
    • 1970-01-01
    • 2018-07-05
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多