Javascript 仅在按下按钮时记录（重新渲染问题）

考虑以下代码：

import React from 'react'
import './App.css';


const App = () => {
  let [count , setCount] = React.useState(0)
  let [approval , setApproval] = React.useState(false)
  let [text , setText] = React.useState('')


  
  const bogusCheck = (text) =>{
    let textArray = text.split(' ')
    console.log(textArray);
  }

  return (
    <div className="App">
      <p>Enter a sentence below and click the button below:</p>
      <textarea cols="30" rows='10' value={text} onChange={e => setText(e.target.value) } />
      <br />
      <button onClick={bogusCheck(text)} >Profanity Check</button>
    </div>

  );
}
export default App;

从“React”导入React
导入“/App.css”；
常量应用=（）=>{
let[count，setCount]=React.useState（0）
let[approval，setApproval]=React.useState（false）
let[text，setText]=React.useState（“”）
常量bogusCheck=（文本）=>{
让text数组=text.split（“”）
log（textArray）；
}
返回(
在下面输入一句话，然后单击下面的按钮：

setText（e.target.value）}/>


亵渎检查
);
}
导出默认应用程序；

我想做的是，当用户输入整个句子并按下按钮时，会出现以下情况：

整个句子作为参数传递给bogusCheck（）函数

使用array.split（“”）函数将句子转换为数组

最后，对整个阵列进行控制台日志记录

问题是，每次我写一封信，即使没有按下按钮，它也会被记录在控制台中。如果在更多情况下使用该数组，例如我将使用它进行循环和条件化，则会出现重新渲染错误

我该如何解决这个问题

非常感谢

---

问题是在每次渲染中都会计算

onClick

处理程序，该道具应该接收一个函数并获得一个值，只需更改该行，如下所示：

<button onClick={() => bogusCheck(text)} >Profanity Check</button>

bogusCheck（text）}>亵渎检查

问题是在每次渲染中都会计算

onClick

处理程序，该道具应该接收一个函数并获得一个值，只需更改该行，如下所示：

<button onClick={() => bogusCheck(text)} >Profanity Check</button>

bogusCheck（text）}>亵渎检查