来自另一个组件的调用函数

时间:2019-09-24 13:07:35

标签: react-native

我尝试通过调用另一个组件中的函数来从一个组件移动到另一个组件。 我从第二个组件创建了一个对象,还检测了该函数,但该函数没有传递给它。

我还打印了一个调试器,发现他应该只是跳过了对函数的调用。

Login.js文件:

import LogOut from '../LogOut/LogOut';
class Login extends Component {
    const obj = new LogOut();

    ForgotPass11() {
        const { a } = this.state
        console.log(this.state.a)
        this.state = { a : 2}
        console.log(this.state.a)
        obj.renderContent();
        console.log(this.state.a)
    }
}

LogOut.js文件:

import React, { Component } from 'react';
import { StyleSheet, View } from 'react-native';
import firebase from 'firebase';
import CardSection from '../HomePage/CardSection';
import Button from '../HomePage/Button';
import Spinner from '../HomePage/Spinner';
import Login from '../Login/Login';
import SignUp from '../Login/SignUp';


class LogOut extends Component {

  state = { a : false };
  state = { loggedIn: null };
  componentWillMount () {

  firebase.initializeApp({ 
    .....
  });

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    this.setState ({ loggedIn: true});
  }

  else {
    this.setState ({ loggedIn: false});
  }
});




  }

  constructor (props) {
    super(props)
    this.state = {
    a: null
  }
}

  renderContent() {
     switch (this.state.loggedIn) {
       case true:
         return(
           <CardSection>
              <Button onPress={() => firebase.auth().signOut()}> 
              Log out
              </Button>
           </CardSection>
         );
       case false:
          if(this.state.a == true){
              return <SignUp />
          }
          else
              return <Login />

          default:
              return <Spinner size= "large" />
     }
  }
  render () {

return (
  <View>
    {this.renderContent()}

  </View>
);



  export default LogOut;

正在更改“ a”

就像我说过的那样,我更改了变量a,并且在更改后它没有调用我的rendercontent()函数

始终在'a'处打印我,并跳过对函数的调用

0 个答案:

没有答案