如何用react js模擬長按？

Question

我想用點擊事件觸發長按事件。 在 React js 中有什么辦法嗎？

接近於此的是 jQuery trigger() function。但我想要 trigger("longPress") 之類的東西，或者用左鍵單擊打開右鍵單擊菜單以做出反應。 兩者都提到（長按觸發器/打開右鍵單擊菜單）對我來說是理想的

Answer 1

你可以通過保持時間來做這個黑客

https://stackblitz.com/edit/react-d1txdm

export default function App() {
  let triggerTime;
  return (
    <div>
      <h1>Try on Google Chrome Desktop</h1>
      <p>Open the console log to see how the event gets triggered.</p>
      <p>The event should not get triggered if there is a long click.</p>
      <img
        src="https://via.placeholder.com/200.png/09f/fff"
        onClick={(e) => {
          if (triggerTime > 1000) return;
          else console.log('normal click');
        }}
        onMouseDown={() => {
          triggerTime = new Date().getTime();
        }}
        onMouseUp={() => {
          let thisMoment = new Date().getTime();
          triggerTime = thisMoment - triggerTime;
        }}
      />
    </div>
  );
}

Answer 2

像這樣的東西怎么樣：

const myComponent = () => {

    let clickHoldTimer = null;

    const handleMouseDown = () => {
        clickHoldTimer = setTimeout(() => {
            //Action to be performed after holding down mouse
        }, 1000); //Change 1000 to number of milliseconds required for mouse hold
    }

    const handleMouseUp = () => {
        clearTimeout(clickHoldTimer);
    }

    return (
        <div onMouseDown={handleMouseDown} onMouseUp={handleMouseUp} />
    )

}