React Js循环遍历父数组以进行登录授权

Posted 2023-02-22

【中文标题】React Js循环遍历父数组以进行登录授权

【英文标题】：React Js Looping over a parent array for login authorisation

【发布时间】：2017-12-10 15:51:06

【问题描述】：

好吧，我已经将一个数组从父级传递给子级，我将在下面包含所有代码

所以我要做的是循环遍历我的数组并检查我的用户输入是否与数组中的一个对象匹配，如果它确实继续执行代码，如果没有给出错误提示

我的父母代码是

...
state = 
    AuthResults: [
        
            id: 1,
            username: "Andy",
            password: "Andy"
        ,
        
            id: 2,
            username: "Dan",
            password: "Dan"
        ,
        
            id: 3,
            username: "Naheem",
            password: "Naheem"
        
    ],

...
<LoginBar AuthRes=this.state.AuthRes/>
...

我给孩子的代码是

CheckLoginAuth()
    console.log("gets to check login auth");
    console.log(this.state.AuthRes);
    Object.keys(this.state.AuthRes).map(function(key)
        console.log(AuthRes[key]);
    )


...
<TextField floatingLabelText="Username" name="Username" onChange=this.handleUsername value=this.state.Username type="text" />
<TextField floatingLabelText="Password" name="Password" onChange=this.handlePassword value=this.state.Password type="text" />
<RaisedButton label="Login" secondary=true onClick=() => this.onRealLoginClick() /><span>&nbsp;</span>
...

它在打印时将对象拉得很好，但我似乎无法执行循环和身份验证。

编辑：是的，所以我现在通过将我的 CheckLoginAuth 函数更改为此没有错误

CheckLoginAuth()
    console.log("gets to check login auth");
    console.log(this.state.AuthRes);
    console.log("Username=" + this.state.Username);
    console.log("Password=" + this.state.Password);
    this.props.AuthRes.map(function(Res)
        console.log(Res.id);
        console.log(Res.username);
        console.log(Res.password);
    )

我如何遍历 Res 中的 id 并将它们与用户输入进行比较

【问题讨论】：

我看不到你在哪里循环通过 AuthRes...

因为我需要检查来自 TextField 的用户输入，以查看用户输入是否匹配 id 的用户名和密码之一作为登录文件（显然数据最终会进入我的 api但我不知道 c#，所以我必须等待其他开发人员之一，所以我现在正在尝试解决它

@JonB 我没有循环通过它，因为我尝试过的一切都没有工作，我问如何去做。我将在 CheckLoginAuth 函数中执行此操作

如果您发布了不起作用的内容，您更有可能获得一个向您展示如何使其起作用的答案。

@JonB 我添加了我尝试过的内容。那只是循环，我对检查部分一无所知。这给了我一个错误说 TypeError: Cannot read property 'state' of undefined

【参考方案1】：

我通过这样做解决了这个问题

CheckLoginAuth() 
    console.log("gets to check login auth");
    console.log(this.state.AuthRes);
    console.log("Username=" + this.state.Username);
    console.log("Password=" + this.state.Password);
    var self = this;
    this.props.AuthRes.map(function (Res) 
        console.log("ID=" + Res.id);
        console.log("Username=" + Res.username);
        console.log("Password=" + Res.password);
        self.LoginAuth(Res);
    );

而不是我上面写的