Javascript 在渲染中获取数据，但在显示数据时，不会显示任何内容

我在工作中面临一个大问题。 我有一个本地地图和一些标记。 当你点击标记时，你会得到一些数据，我会把它显示在标记中。 但是我能够得到数据，但是当我显示数据时，什么也看不出来。然而，在渲染函数中，当我执行console.log时，我可以看到我的显示，因此我无法理解为什么数据出现在渲染中而不是返回中，这对我来说毫无意义，我尝试了一切

这是我的密码。 如果有人能帮助我，那就太好了。 谢谢你：）

我只是放了一个随机的免费api给你看

export class CustomMarker extends Component {
  constructor(props) {
    super(props)
    this.state = {
      bonjour: ""
    }
  }

  getData() {
    axios.get('https://dog.ceo/api/breeds/image/random').then((data) => {
      this.setState({ bonjour: data.data.message})
      //console.log(this.state.bonjour)
    })
  }

  render() {
    console.log(this.state.bonjour)
    return (

      <Marker key={this.props.id} coordinate = {{latitude: Number(this.props.data.dLocLati), longitude: Number(this.props.data.dLocLongi)}}
          pinColor = {"red"}
          title={this.props.data.iVehId}
          description={this.props.data.sLocStatus}
          onPress={() => this.getData()
          }
          >
      <Callout>
      <View>
        <Text>{this.state.bonjour}</Text>
      </View>
        </Callout>
      </Marker>
    )
  }
}

导出类CustomMarker扩展组件{
建造师（道具）{
超级（道具）
此.state={
你好：“
}
}
getData（）{
axios.get（）https://dog.ceo/api/breeds/image/random）。然后（（数据）=>{
this.setState（{bonjour:data.data.message}）
//console.log（this.state.bonjour）
})
}
render（）{
console.log（this.state.bonjour）
返回(
这个文件名为getData（）
}
>
{this.state.bonjour}
)
}
}