Question

我正在尝试在响应页面加载时将某些内容记录到我的控制台。我从来没有真正使用过 React，我之前只使用过 node.js，所以这对我来说是新的。

到目前为止我有这个，但它似乎不起作用。似乎更多的js然后反应。

window.onload(console.log("logging this here"))

我该怎么做？

页面上的更多代码：

class NormalLoginForm extends React.Component {
  state = {
    error: null,
  }

  handleSubmit = (e) => {
    e.preventDefault();
    this.props.form.validateFields((err, values) => {
      if (err) return

      const email = this.props.form.getFieldValue('email')
      const password = this.props.form.getFieldValue('password')
      var accountStatus1 = ""
      AuthorizationHome.doSignInWithEmailAndPassword(email, password)
        .then(() => {
          firebase.auth().onAuthStateChanged((user) => {
          // window.onload(function (console.log("hello"))

Answer 1

对于类组件可以使用；

ComponentDidMount(){
console.log("logging this here")
}

对于可以使用的功能组件；

useEffect(() => { 
console.log("logging this here")
}, [])

Answer 2

这是不可能的。 React 组件将在窗口加载事件后呈现。所以代码永远不会触发回调。

如果您想调用组件中的某些内容，您需要更改逻辑并执行回调。

一些例子：

const ComponentWithAuth = () => {
  const [user, setUser] = useState(null);

  useEffect(() => {
   getAuthUser().then(setUser)
  });

  if (user) {
   return <PrivateComponent/>
 }
  return <LoginForm setUser={setUser}/>
}

const LoginForm = ({setUser) => {
 const handleSubmit =async () => {
    ... 
    const user =await getAuthUser();
    setUser(user);
  }
  ...
}

如何设置页面加载反应

2 个答案: