首页 > 解决方案 > JavaScript 函数在包裹开发服务器的 HTML 文件中调用时给了我(未捕获的 ReferenceError:checkIfUserLogedIn 未定义)

问题描述

在我的页面加载时admin.html调用函数checkIfUserLogedIn()

<!DOCTYPE html>
<html>
    <head>
        <title>Admin</title>
    </head>
    <body onload="checkIfUserLogedIn()">
        <h1>Admin Pannel</h1>
        <script src="./main.js"></script>
    </body>
</html>

main.js我从文件中导入了我的checkIfUserLogedIn()函数。checkUser.js

import firebase from 'firebase/app';
import "firebase/auth";
import checkIfUserLogedIn from './checkUser';

checkUser.js文件看起来像这样

import firebase from 'firebase/app';

export default function checkIfUserLogedIn() {
    const user = firebase.auth().currentUser;

    if (user) {
        console.log(user)
    } else {
        console.log("user loged out")
    }
}

这是index.html项目的文件入口点

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sign In</title>
    <link rel="stylesheet" href="./style.css">
</head>
<body>
    
    <div class="form-container">
        <h1>Sign In</h1>
        <form method="post" id="signin-form">
            <input type="email" name="email" id="signin-email" placeholder="Email" required="true"> <br>
            <input type="password" name="password" id="signin-password" placeholder="Password" required="true"> <br>
            <input type="submit" value="Sing In" class="btn">
        </form>
        
        <p><a href="./signup.html">Create New Account</a></p>
        <p><a href="./admin.html">Create New Account</a></p>
    </div>
    

    <script src="./main.js"></script>
</body>
</html>

我想在文件加载checkIfUserLogedIn()时调用函数,但我给出了一个错误。admin.htmlUncaught ReferenceError: checkIfUserLogedIn is not defined

标签: javascriptparceljs

解决方案


我解决问题。感谢克里斯-g

我在 admin.html 页面正文中添加了“admin”类。然后在我的 main.js 文件中,我检查了主体是否有一个名为“admin”的类,如果它添加了一个加载事件侦听器。

if(document.body.classList.contains('admin')) {
        window.addEventListener('load', checkIfUserLogedIn)
}

推荐阅读