javascript - 如果未直接传递给requestAnimationFrame，则函数体不会执行

所以我原来有这个：

requestAnimationFrame(appendItemsFragment(itemsFragment, appendItemsFragmentCallback));

但是我需要做更多的事情，所以我将其转换为

requestAnimationFrame(() => {
  appendItemsFragment(itemsFragment, appendItemsFragmentCallback);
  myNewFunctioncall();
});

原始功能定义为：

const appendItemsFragment = (itemsFragment, callback) => () => {
  itemsContent.appendChild(itemsFragment);
  destroySpinner();
  if (callback) {
    callback();
  }
};

但是在requestAnimationFrame的修改版本中，未执行功能appendItemsFragment（我放置了alert（），并且它不起作用，我按了两次F10并返回到requestAnimationFrame的末尾）。这是为什么？

最佳答案

appendItemsFrament()返回一个回调函数。在原始代码中，requestAnimationFrame()执行该回调。现在，您需要在包装函数中执行此操作。

requestAnimationFrame(() => {
  appendItemsFragment(itemsFragment, appendItemsFragmentCallback)();
  myNewFunctioncall();
});

但是，这将对显示的每个帧调用appendItemsFragment()，这将重复追加项目片段，这可能不是您想要的。您需要调用一次，保存结果，然后在包装函数中调用它。

let callback = appendItemsFragment(itemsFragment, appendItemsFragmentCallback);
requestAnimationFrame(() => {
  callback();
  myNewFunctioncall();
});