React Native+Spring Boot项目中一对多关联下如何获取关联用户用户名？

有两种可行的实现方式，优先推荐第一种后端调整的方案，实现更简单、性能更好：

方案1：后端调整返回结构（推荐） #

你的Spring Boot后端使用JHipster开发，Task和User本身已经配置了一对多关联关系，默认接口返回Task数据时仅序列化了外键user_id，没有带出关联用户的属性。
你只需要调整后端Task对应的DTO序列化规则，让查询Task接口直接返回关联用户的用户名字段即可，比如可以返回嵌套的user对象包含username属性，也可以直接在Task外层新增userName字段。
调整完成后，你直接修改任务详情页的用户展示代码即可：

// 假设后端返回的task对象下嵌套了user对象，包含username属性
<Text style={styles.text}>User: {this.props.task.user?.username ?? '无归属用户'}</Text>

方案2：前端额外请求用户信息 #

如果暂时不方便调整后端代码，可以在前端额外调用用户查询接口获取对应用户名，操作步骤如下：

1. 先在构造函数中初始化存储用户信息的state：

constructor(props) {
   super(props)
   Navigation.events().bindComponent(this)
   // 新增state存储任务归属用户信息
   this.state = {
     taskUser: null
   }
   this.props.getTask(this.props.data.entityId)
}

2. 新增componentDidUpdate生命周期监听task加载状态，拿到user_id后调用用户查询接口（你项目里的用户详情查询接口，通常Ignite CLI生成的代码会自带getUser这类方法）：

componentDidUpdate(prevProps) {
  // 仅当task加载完成且user_id发生变化时发起用户查询
  if (this.props.task && (!prevProps.task || prevProps.task.user_id !== this.props.task.user_id)) {
    this.props.getUser(this.props.task.user_id).then(res => {
      this.setState({ taskUser: res.data })
    })
  }
}

3. 修改render部分的用户展示逻辑，做加载兼容：

<Text style={styles.text}>
  User: {this.state.taskUser ? this.state.taskUser.username : '加载中...'}
</Text>

注意：需要提前在页面的依赖注入部分将用户查询的接口方法挂载到props上才能调用。

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