我單擊了 Button 并執行了 onClickUserId 函式。
然后，如果我運行這個函式，我也想運行 onClickListContent 按鈕函式。我不知道該怎么辦。
我想在 console.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>
)
我試圖將 onClickListContent.click() 函式放在 onClickUserId 函式中，但由于引數值的原因無法執行。我應該如何撰寫代碼？
uj5u.com熱心網友回復：
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>
);
}
您可以創建對該按鈕的參考并使用它來觸發點擊功能。
uj5u.com熱心網友回復：
使用反應useRef()鉤子：
const listContentBtn = useRef(null);
const onClickUserId = (id) => {
console.log(id)
listContentBtn.current.click()
}
const onClickListContent = (Content) => {
console.log(Content);
};
return (
<div>
<>
<div>
<button onClick={() => onClickUserId(3)}>click</button>
</div>
</>
<>
<div>
<button onClick={() => onClickListContent(6)} ref={listContentBtn}>click</button>
</div>
</>
</div>
)
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/462531.html
標籤：javascript 反应 按钮 前端
上一篇：React-用按鈕隱藏內容
下一篇：按鈕轉向側身錨