Javascript 单击按钮时如何使其他按钮功能自动运行

发布于04月15日

I clicked the Button and executed the onClickUserId function.
Then, if I run this function, I want to run the onClickListContent Button function as well. I don't know what to do.

我想在控制台中显示参数值.记录日志(log)，以便在单击onClickUserId值时自动单击onClickListContent.


const onClickUserId = (id) => {
    console.log(id)
  }


const onClickListContent = (Content) => {
    console.log(Content);
};

return (
    <div>

    <>
    <div>
    <button onClick={() => onClickUserId(3)}>click</button>
    </div>
    </>

    <>
    <div>
    <button onClick={() => onClickListContent(6)}>click</button>
    </div>
    </>

    </div>
)

我试着把内容放在 list 上.onClickUserId函数中的click()函数，但由于参数值的原因，无法执行该函数.

推荐答案

import {useRef} from 'react'
export default function App() {
  const ref = useRef()
  const onClickUserId = (id) => {
    console.log(id);
    ref.current.click();
  };

  const onClickListContent = (Content) => {
    console.log(Content);
  };

  return (
    <div>
      <>
        <div>
          <button onClick={() => onClickUserId(3)}>click</button>
        </div>
      </>

      <>
        <div>
          <button ref={ref} onClick={() => onClickListContent(6)}>click</button>
        </div>
      </>
    </div>
  );
}

您可以创建对该按钮的引用，并使用它触发单击功能.