Реагировать Native: как изменить <Text> значение динамически

Question

Я хочу, чтобы изменить значение динамически на какое-то событие

Событие:

BackgroundGeolocation.on('location', (location) => {  
    currentDistance = distance(previousLatitude,previousLongitude,latitude,longitude); 

      this.setState({ 
       text: currentDistance     
      });         

    }); 
<Text> 
    Moving : {this.state.text} 
</Text> 

Кто-нибудь знает, как изменить текст или любой другой способ достичь?

Answer 1

Ниже приведен пример использования состояний для динамического изменения текстового значения при нажатии на него. Вы можете установить любое событие, которое вы хотите.

import React, { Component } from 'react' 
import { 
    Text, 
    View 
} from 'react-native' 

export default class reactApp extends Component { 
    constructor() { 
     super() 
     this.state = { 
     myText: 'My Original Text' 
     } 
    } 
    updateText =() => { 
     this.setState({myText: 'My Changed Text'}) 
    } 
    render() { 
     return (
     <View> 
      <Text onPress = {this.updateText}> 
       {this.state.myText} 
      </Text> 
     </View> 
    ); 
    } 
} 

Answer 2

Использование:

<TextInput editable={false} ref={component=> this._MyComponent=component}/> 

вместо:

<Text></Text> 

Затем вы можете изменить текст следующим образом:

onPress= {()=> { 
    this._MyComponent.setNativeProps({text:'my new text'}); 
}