1. ホーム
  2. javascript

[解決済み] 複数分など長時間のタイマーを設定する

2023-03-25 18:13:43

質問

リアクトネイティブでfirebase authを使いたいのですが、どうすればいいですか? LoginSignup を追加しましたが、黄色いエラーが出ました。

タイマーを長時間、つまり何分間も設定すると、タイマーモジュールが起き続けるため、Android ではパフォーマンスと正しさの問題があり、タイマーはアプリがフォアグラウンドにあるときのみ呼び出すことができます。参照 ( https://github.com/facebook/react-native/issues/12981 ) を参照してください。(ソー setTimeout with duration 111862ms)

どうすれば直せますか?

私はそれを無視したくない、私はこのエラーを理解し、最高の、標準的な方法でそれを解決したいです。

そして、これは私のコードです。

  export default class Login extends Component {
        constructor(props) {
            super(props)
            this.state = {
                email: '',
                password: '',
                response: ''
            }
            this.signUp = this.signUp.bind(this)
            this.login = this.login.bind(this)
        }
        async signUp() {
            try {
                await firebase.auth().createUserWithEmailAndPassword(this.state.email, this.state.password)
                this.setState({
                    response: 'Account Created!'
                })
                setTimeout(() => {
                    this.props.navigator.push({
                        id: 'App'
                    })
                }, 1500)
            } catch (error) {
                this.setState({
                    response: error.toString()
                })
            }
        }
        async login() {
            try {
                await firebase.auth().createUserWithEmailAndPassword(this.state.email, this.state.password)
                this.setState({
                    response: 'user login in'
                })
                setTimeout(() => {
                    this.props.navigator.push({
                        id: 'App'
                    })
                })

            } catch (error) {
                this.setState({
                    response: error.toString()
                })
            }

        }
        render() {
            return (
                <View style={styles.container}>
                    <View style={styles.containerInputes}>
                        <TextInput
                            placeholderTextColor="gray"
                            placeholder="Email"
                            style={styles.inputText}
                          //  onChangeText={(email) => this.setState({ email })}
                            onChangeText={(email) => {console.log(email);}}
                        />
                        <TextInput
                            placeholderTextColor="gray"
                            placeholder="Password"
                            style={styles.inputText}
                            password={true}
                            onChangeText={(password) => this.setState({ password })}
                        />
                    </View>
                    <TouchableHighlight
                        onPress={this.login}
                        style={[styles.loginButton, styles.button]}
                    >
                        <Text
                            style={styles.textButton}
                        >Login</Text>
                    </TouchableHighlight>
                    <TouchableHighlight
                        onPress={this.signUp}
                        style={[styles.loginButton, styles.button]}
                    >
                        <Text
                            style={styles.textButton}
                        >Signup</Text>
                    </TouchableHighlight>
                </View>
            )
        }
    }

私が報告したのは Google Firebase チーム : ( https://github.com/firebase/firebase-js-sdk/issues/97 )

どのように解決するのですか?

Google Said の Josh Crowther ソフトウェア エンジニア。

多段階の短時間の setTimeouts を使用しても、実際には問題は解決されません。Timer モジュールはまだアクティブなままで、アプリは警告で示されたパフォーマンスの問題に依然としてさらされています。ここでの問題は、長いタイマーを必要とするユースケースがあり、react-native はそのユースケースに対して最適化されていないことです。

つまり、正味のところ このバグはここでは修正できず、エラーを回避することしかできません。 長時間 (数分間) のタイマーを設定する を参照してください)、警告を無効にすることができます。私たちのコードで警告を無効にする作業を行うことは、(警告を無効にする以上の)問題の解決にはならず、完全に不要な SDK コードや重量が追加されます。

私は、上記の問題に対処することをお勧めします (すなわち facebook/react-native#12981 を参照してください。