如果react中的textbox为null，我想禁用该按钮

Question

return (
{jobstate.jobs.map((data,i) =>{ 
<form>
<input type="text" placeholder="Post a comment" onChange={(e) => jobcmthandler(e,data._id,i) } />
<button type="button" onClick={postcmt} >Send</button>
</form>
})}
)

我使用map函数生成动态HTML，我想禁用按钮(如果文本为null(以获得诱导形式，以及如何在react js 中点击按钮获得文本值

Answer 1

我真的不明白你为什么要这么做，但现在开始(示例(：

import React, { useState } from "react";
export default function App() {
return ["Name", "Age"].map((label) => <Form label={label} />);
}
function Form({ label }) {
const [readValue, writeValue] = useState("");
return (
<form>
<label>{label}</label>
<input
type="text"
placeholder="Post a comment"
onChange={(e) => writeValue(e.target.value)}
value={readValue}
/>
<button
type="button"
onClick={() => console.log("Submit")}
disabled={readValue === ""}
>
Send
</button>
</form>
);
}