React Native中如何将接口返回多字段存入同一变量并绑定可编辑TextInput

问题原因 #

1. React的useState更新函数仅支持传入1个参数作为状态的新值，你传入多个参数的写法无效，只会取第一个参数赋值给状态。
2. 字段名、变量名存在多处拼写错误，无法正确获取接口返回值：
   • 接口返回的地址字段为subregion、postalCode、region，你写的subreg、code均为错误字段名
   • 拼写错误：将response错写为respone
3. TextInput的value属性仅接收字符串类型值，你直接传入整个response对象的话，会显示[object Object]而非你需要的地址内容。同时可编辑的TextInput必须绑定onChangeText事件同步更新状态，否则无法输入修改。

正确实现方式 #

1. 接口返回后的状态赋值

先拼接三个字段为完整字符串，可根据需求自定义字段之间的分隔符（示例用空格分隔，也可替换为顿号、逗号等）：

// 假设response为接口返回的完整地址对象
// 加 || '' 是为了避免字段为null时显示"null"字符串
const fullAddress = `${response.subregion || ''} ${response.postalCode || ''} ${response.region || ''}`
// 去除首尾多余空格后更新状态
setCompleteAdd(fullAddress.trim())

2. TextInput组件绑定

<TextInput
  value={CompleteAdd}
  // 绑定输入事件，确保可编辑时状态同步更新
  onChangeText={newText => setCompleteAdd(newText)}
  // 其他自定义属性，比如style、placeholder等自行补充
/>

内容的提问来源于stack exchange，提问作者user14877357