离开应用程式时反应原生停止动画

Question

我有一个Animated.timing，我想在用户导航到另一个应用程序时将其停止，这可能吗？

Answer 1

您可以像这样使用AppState：

import React, {Component} from "react"
import {AppState, View} from "react-native"

class YourClass extends Component {
    state = {
       appState: AppState.currentState
    }
    componentDidMount() {
      //add a listener here
      AppState.addEventListener("change", this._handleAppStateChange);
    }

    componentWillUnmount() {
          // remember add this line
      AppState.removeEventListener("change", this._handleAppStateChange);
    }

    _handleAppStateChange = (nextAppState) => {
           if (this.state.appState.match(/inactive|background/) && nextAppState === "active"){
           console.log("App has come to the foreground!")

           }else{
             //here you can call stop animation function
           }
           this.setState({appState: nextAppState});
     }


     render() {
        return (
        <Text>Current state is: {this.state.appState}</Text>
        );
     }

}