如何在用户未修改时保存TextInput的defaultValue值？

你的问题核心是进入编辑模式时没有初始化presentTitle的初始值，导致用户未修改内容时，presentTitle保持初始空值，更新数据库时就传了空字符串。下面是几个简单的解决办法：

方案1：切换编辑状态时初始化presentTitle #

在触发编辑的按钮点击逻辑里，设置isEditing为true的同时，直接把原标题赋值给presentTitle：

// 假设你的编辑按钮点击事件是这样的
const handleEditToggle = () => {
  if (!isEditing) {
    // 进入编辑模式时，初始化presentTitle为原标题
    setPresentTitle(receipes.title);
  } else {
    // 退出编辑模式时，调用更新函数同步到Firebase
    updateRecipeToFirebase({ ...receipes, title: presentTitle });
  }
  setIsEditing(!isEditing);
};

这样不管用户有没有修改输入框内容，presentTitle都有正确的初始值，更新时就不会为空。

方案2：改用受控组件（推荐） #

把TextInput改成受控组件，用value绑定presentTitle，同时在进入编辑模式时初始化值：

// 切换编辑状态的逻辑同方案1
{!isEditing ? (
  <Text style={styles.headingLarge}>{receipes.title}</Text>
):(
  <TextInput 
      placeholder='Titel'
      autoFocus={true}
      value={presentTitle} // 这里用value替代defaultValue
      style={styles.headingLarge}
      onChangeText={text => setPresentTitle(text)}
  />
)}

受控组件的好处是输入框的值完全由状态控制，逻辑更清晰，避免defaultValue带来的非受控状态问题。

方案3：用useEffect监听编辑状态初始化值 #

如果不想修改按钮点击逻辑，可以用useEffect监听isEditing的变化，当进入编辑模式时自动初始化presentTitle：

useEffect(() => {
  if (isEditing) {
    setPresentTitle(receipes.title);
  }
}, [isEditing, receipes.title]);

这样每次切换到编辑模式，都会自动把原标题设置到presentTitle里，确保更新时有值。

内容的提问来源于stack exchange，提问作者mr-woodapple