p5.j​​s mousePressed事件返回未定义

Question

我无法获得mousePressed来控制台记录MouseEvent。我什至不确定设置功能中的安装位置是否正确？

https://codesandbox.io/embed/withered-monad-jrhyw

import React from 'react';
import Sketch from 'react-p5';

const App: React.FC = () => {
  const setup = (p5: any) => {
    canvas = p5.createCanvas(window.innerWidth, window.innerHeight);

    canvas.mouseWheel((e: MouseEvent) => {
      console.log(e); // Wheel Event
    });

    canvas.mousePressed((e: MouseEvent) => {
      console.log(e); // Undefined
    });

  };

  const draw = (p5: any) => {
    p5.background(50);
    p5.fill(0);
    p5.rect(25, 25, 50, 50);
  };

  return (
    <React.Fragment>
      <Sketch setup={setup} draw={draw} />
    </React.Fragment>
  );
};

export { App };

Answer 1

react-p5库的readme指示您应将mousePressed方法用作道具，因此请尝试在setup之外定义它，然后将其传递：

const mp = (e: MouseEvent) => {
  console.log(e);
})

<Sketch setup={setup} draw={draw} mousePressed={mp}/>

尽管如此，我还是尝试在setup内定义其他几种方法，并且所有方法似乎都能正常工作。 mousePressed是唯一需要作为道具传递的道具。

Answer 2

我已经在GitHub Issue上回答了这个问题，以便仅使用一个渠道来跟踪并解决该问题。 Github Issue #16