Попытка Оживить Реагировать Native Text Value

Question

поэтому в основном им пытаются получить это делают функции на самом деле обновить значение в реальном времени (как сейчас он просто переходит к конечному значению после завершения анимации)

this.state = { 
 
    pleaseDisplayMe: Animated.value(0); 
 
} 
 

 
triggerAnimation(){ 
 
    Animated.timing(
 
     this.state.pleaseDisplayMe, 
 
     {toValue: 100, 
 
     duration: 5000} 
 
    ).start(); 
 
} 
 

 
render(){ 
 
    return <Animated.Text>{this.state.pleaseDisplayMe}</Animated.Text> 
 
}

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

Я пробовал самостоятельно писать свою собственную функцию setInterval, но мне нужно, чтобы она соответствовала времени других анимаций, и мне бы хотелось получить доступ к библиотеке EZ RN!

спасибо!

Answer 1

React Native имеет timers, который вы можете использовать. Например, чтобы сделать то, что вы пытаетесь достичь с помощью setInterval:

state = {pleaseDisplayMe: 0} 

componentDidMount() { 
    setInterval(() => { 
    this.setState({pleaseDisplayMe: this.state.pleaseDisplayMe + 1}) 
    }, 1000); 
} 

render() { 
    return (
    <Text>{this.state.pleaseDisplayMe}</Text> 
) 
} 

Однако, если вы пытаетесь вместо пытаетесь реально получить значение из анимации, вы должны прикрепить слушатель к анимированному и получить значение оттуда как there is no way to synchronously read the value because it might be driven natively. Возможное очень плохо (я также новый Реагировать Native) пример это было бы что-то вроде этого:

state = { 
    pleaseDisplayMe: new Animated.Value(0), 
    value: 0, 
} 

triggerAnimation(){ 
    this.state.pleaseDisplayMe.addListener(({value}) => this.setState({value: value})); 
    Animated.timing(
    this.state.pleaseDisplayMe, 
    {toValue: 100, 
    duration: 5000} 
).start(); 
} 

render() { 
    return (
    <Text>{this.state.value}</Text> 
) 
} 

Answer 2

Я никогда не пробовал это реагировать родной, но будет эта библиотека работает?

https://www.npmjs.com/package/react-typist