Может получить ответ, но не может отобразить реакцию

Я очень новичок в реакции, и мне нужно преобразовать широту в долготу, которую широта и долгота получают от огневой базы. Итак, проблема в том, что я могу записать адрес в консоль. Однако я не могу отобразить

Это мой учредитель

this.getAddressFromLatLong = this.getAddressFromLatLong.bind(this)

Это функция, которую я написал для преобразования

getAddressFromLatLong(lat, long) 
{ Geocode.fromLatLng(lat, long).then( 
    response => { 
        const address = response.results[0].formatted_address; 
        console.info(address); 
        return address; 
    }, 
    error => { console.error(error); } 
)}

Здесь я показываю адрес

return ( 
    <tr key = {atData.uid}> 
        <td>{atData.uid}</td> 
        <td>{atData.user}</td> 
        <td><TimeStamp time = {atData.dateTime} format='full' /></td> 
        <td>{this.getAddressFromLatLong(atData.latitude, atData.longtitude)}</td> 
    </tr> 
)

Посоветуйте пожалуйста>. <

Редактировать:

Я понял, что кода, который я опубликовал, недостаточно, поэтому вот дополнительная информация о моих проблемах и конечном продукте, который я хотел

Итак, у меня есть эта страница, на которой отображаются все адреса и пользователи, когда пользователь выбирает блокировку из раскрывающегося списка, который получает от firebase.

Вот как я сделал свой выпадающий список

componentWillMount() {
    const lockSelected = this.state.selectedLock
    console.info(lockSelected)
    // Calling the Lock List
    axios
        .get(process.env.REACT_APP_FIREBASE_DATABASE + '/' + doGetLocklist() + '.json?auth=' + process.env.REACT_APP_FIREBASE_DATABASE_SECRET)
        .then((response) => {
            // console.info("=== componentDidMount: axios - Lock List == = ")
            this.setState({ locklistArray: response.data, loading: false })
        })
        .catch((err) => { })
}
renderDropdown() {
    return _.map(this.state.locklistArray, lockData => {
        return (
            <option value = {lockData.uid}>{lockData.lockName}</option>
        )
    })
}

Вот как я отображаю раскрывающийся список

<FormControl componentClass = "select" placeholder = "select" onChange = {this.detectOnChangeEvent}>
    <option value = "">- Please Select a lock -</option>
    {this.renderDropdown()}
</FormControl>

После этого, когда пользователь выбрал блокировку, он запустит эту функцию detectOnChange, чтобы повторно отобразить таблицу с данными блокировки.

detectOnChangeEvent(event) {
    this.setState({
        selectedLock: event.target.value,
    })
    this.fetchSelectedATData(event.target.value)
    this.forceUpdateHandler()
}

forceUpdateHandler() {
    this.forceUpdate();
};

fetchSelectedATData(atlist) {
    var lockSelected = atlist
    axios
        .get(process.env.REACT_APP_FIREBASE_DATABASE + '/' + doGetAuditTrailList() + '/' + lockSelected + '.json?auth=' + process.env.REACT_APP_FIREBASE_DATABASE_SECRET)
        .then((response) => {
            // console.info("=== componentDidMount: axios - User List == = ")
            console.info(response.data)
            this.setState({ atArray: response.data, loading: false })
        })
        .catch((err) => { })

    this.renderATlistArray()
}

renderATlistArray() {
    if (this.state.loading) {
        return (<Loading />)
    } else {
        return _.map(this.state.atArray, atData => {
            return (
                <tr key = {atData.uid}>
                    <td>{atData.uid}</td>
                    <td>{atData.user}</td>
                    <td><TimeStamp time = {atData.dateTime} format='full' /></td>
                    <td>{this.getAddressFromLatLong(atData.latitude, atData.longtitude)}</td>
                </tr>
            )
        })
    }
}

Итак, теперь все работает нормально. Я знаю, что это тоже неправильный способ. Просто я не могу отобразить на своей таблице, когда я могу консольный журнал, и он возвращает правильный адрес.

Вот скриншот ответа

Надеюсь, со всей этой добавленной информацией вам, ребята, будет лучше понять код!