Question

我想如下检测组件的mount（）中的滚动事件，并更改组件中使用的数据。

・ component

void mexFunction(int nlhs, mxArray *plhs[], int nrhs, const mxArray *prhs[])
{
    int rows = 5;
    vector<string> predictLabels;
    predictLabels.resize(rows);
    predictLabels.push_back("string 1");
    predictLabels.push_back("string 2");
    //etc...

    // "vector<string>" convert to  matlab "cell" type
    mxArray *arr = mxCreateCellMatrix(rows, 1);
    for (mwIndex i = 0; i<rows; i++) {
        mxArray *str = mxCreateString(predictLabels[i].c_str());
        mxSetCell(arr, i, mxDuplicateArray(str));
        mxDestroyArray(str);
    }
    plhs[0] = arr;
}

・ utils / checkScroll.js

<script>
import checkScroll from '~/utils/checkScroll'

export default {
  ...
  data() {
    return {
      scrollPosition: 0
    }
  },
  mounted() {
    window.addEventListener(
      'scroll',
      checkScroll(this.scrollPosition, window.scrollY)
    )
  },
</script>

在这种情况下有两个问题

1.我想每次滚动都执行此功能，但是该功能仅在第一次滚动时执行
2.组件内部export default function checkScroll(scrollPosition, scrollY) { scrollPosition = scrollY }的值不变。

如果是这种情况，它将如何运作？

Answer 1

第一个问题不应该发生。如果您添加eventListener，它将在您每次滚动时执行，并且我在本地检查了它是否按预期工作。但是您应该将一个函数传递给事件侦听器，但是您要传递已经执行的函数。

您可以从中返回结果并执行类似的操作

export default function checkScroll(event) {
  return window.scrollY;
}

mounted() {
    window.addEventListener("scroll", event => {
      this.scrollPosition = checkScroll(event);
    });
  }

此处是带有示例https://codesandbox.io/s/0qjkoox68v的CBS

Nuxt.js：如何定义组件的mount（）中使用的通用方法，以及如何更改组件的数据

1 个答案: