为了账号安全,请及时绑定邮箱和手机立即绑定

反应钩子:输入onChange第一个字符不能删除

反应钩子:输入onChange第一个字符不能删除

墨色风雨 2022-05-26 11:08:22
我有一些输入来创建/更新公式,1)如果 value={question},一切正常,除了我不能删除最后一个字符(=输入的第一个字符)2)如果我不提及值,那一切都很好,除了当我想用雪佛龙图标按钮更改问题顺序时,数据库已经很好地改变了,但输入值仍然显示在最后一个地方。<input        type="text"        value={question}        placeholder="blabla"        onChange={event => {          event.preventDefault();         const value = event.target.value;         setUpdatedQuestion(value);        }}      />我尝试将 if (event.target.value == "" || event.target.value) 添加到 onChange 但也不起作用好的,我找到了一些东西,但它是一个 McGyver 提示,不是很干净:在所有新添加问题之前添加一个空格啊啊。但后来我再也看不到我的占位符了:/仅供参考:问题来自 questions.map,setUpdatedQuestion 更新问题,newOrder 也更新问题//in QuestionsContent.js (questions is a questions tab)const QuestionsContent = props => {return (    <form onSubmit={onSubmit}>      {isLoading === false && questions.length > 0        ? questions.map((question, i) => {            return (              <div key={i}>                <QuestionLine                  {...question}                  questions={questions}                  setQuestions={setQuestions}                  setNewOrder={setNewOrder}                />              </div>            );          })        : null}        <button           onClick={event => {            event.preventDefault();            setAddQuestion({              question: null,              type: "texte"            });          }}        >         Add a question        </button></form>);};//in QuestionLine.js:const QuestionLine = ({  question,  setNewOrder,  setQuestions,  questions}) => {  const [updatedQuestion, setUpdatedQuestion] = useState("");  // * UPDATE QUESTION *******************************  useEffect(() => {    if (updatedQuestion !== "") {      const tab = [];      for (let j = 0; j < questions.length; j++) {        if (j === i) {          const newObject = {            question: updatedQuestion,            type: type          };          console.log("adding updatedQuestion ===>", newObject);          tab.push(newObject);        } else {          tab.push(questions[j]);        }      }感谢您的宝贵帮助
查看完整描述

1 回答

?
三国纷争

TA贡献1804条经验 获得超7个赞

问题可能来自于 useEffect 中的条件:当您要删除字符串的最后一个字符时,updatedQuestion 的状态为空,因此不执行条件



查看完整回答
反对 回复 2022-05-26
  • 1 回答
  • 0 关注
  • 126 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信