显示错误无法在 microsoft edge 中读取 null 的属性“split”，但在 chrome 上工作正常

如何解决显示错误无法在 microsoft edge 中读取 null 的属性“split”，但在 chrome 上工作正常

我正在制作一个 react-app，

我已将用户名存储在 localStorage 上：userName = Super Admin

这里我需要取名字的第一个字母和第二个名字的第一个字母来显示在个人资料部分，如：SA

所以我先把它分开，然后取子串来得到名字的第一个字母。

它在 chrome 上工作正常，但当我切换到边缘时，它显示错误：

TypeError: Cannot read property 'split' of null

这是我的代码：

class TopNavbar extends Component {
  state = {};
  render() {
    var user = localStorage.getItem("userName");
    console.log(user) //Super Admin 
    var components = user.split(" ");
    let firstNameLetter = components[0].substring(0,1);
    let secondNameLetter = components[1].substring(0,1);
    console.log(firstNameLetter)   //S
    console.log(secondNameLetter ) //A
    return (
      <>
        <Nav>
          <NavbarContainer>
            <NavlogoSection>
              <logoText>FIX-BRIX</logoText>
            </NavlogoSection>
              <UserNameSection>
                <UserNameText>
                  {firstNameLetter}
                  {secondNameLetter}
                </UserNameText>
              </UserNameSection>
          </NavbarContainer>
        </Nav>
      </>
    );
  }
}

export default TopNavbar;

注意：

它在 google chrome 上工作正常，只在 microsoft edge 中显示错误

任何建议都会有帮助

解决方法

您可能还没有在 Microsoft Edge 的 localstorage 中使用 userName。您不能假设 - 在尝试 Illuminate\Database\QueryException SQLSTATE[HY000]: General error: 1005 Can't create table `ecommerce`.`users` (errno: 150 "Foreign key constraint is incorrectly formed") (SQL: alter table `users` add constraint `users_user_role_foreign` foreign key (`user_role`) references `user_role` (`role`) on delete cascade) at F:\ecommerce-indian\ecommerce\vendor\laravel\framework\src\Illuminate\Database\Connection.php:678 674▕ // If an exception occurs when attempting to run a query,we'll format the error 675▕ // message to include the bindings with SQL,which will make this exception a 676▕ // lot more helpful to the developer instead of just the database's errors. 677▕ catch (Exception $e) { ➜ 678▕ throw new QueryException( 679▕ $query,$this->prepareBindings($bindings),$e 680▕ ); 681▕ } 682▕ 1 F:\ecommerce-indian\ecommerce\vendor\laravel\framework\src\Illuminate\Database\Connection.php:471 PDOException::("SQLSTATE[HY000]: General error: 1005 Can't create table `ecommerce`.`users` (errno: 150 "Foreign key constraint is incorrectly formed")") 2 F:\ecommerce-indian\ecommerce\vendor\laravel\framework\src\Illuminate\Database\Connection.php:471 PDOStatement::execute() 之前，您需要检查 userName 是否存在。

考虑：

.split()