Question

我想要停止一个循环，当它匹配一个条件，但它只是没有破坏香港专业教育学院尝试尝试捕获循环与投掷e并抛出新的类型错误但它只是没有打破我如何得到它打破这里是代码我想打破

LoginAuth = (Res) => {
    try {
        if (Res.username === this.state.Username && Res.password === this.state.Password) {
            return (
                this.setState({
                    isLoggedIn: true,
                }, function () {

                }),
                this.hideModal()
            );
        } else {
            console.log("Gets to login auth and false");
        }
}

我想在state.username和state.password中的用户输入等于变量Res中的用户输入时停止，但是我不能让它停止循环我该怎么做。

这是调用此函数的函数

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.forEach(function (Res) {
        return (
            console.log("ID=" + Res.id),
            console.log("Username=" + Res.username),
            console.log("Password=" + Res.password),
            self.LoginAuth(Res)
        );
    });
}

编辑

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.some(function (Res) {
        console.log("ID=" + Res.id);
        console.log("Username=" + Res.username);
        console.log("Password=" + Res.password);
        if (Res.username === this.state.Username && Res.password === this.state.Password) {// the error is on this line saying it doesnt know what Username or Password are in the state
            return (
                this.setState({
                    isLoggedIn: true,
                }, function () {
                }),
                this.hideModal()
            );
        } else {
            console.log("Gets to login auth and false");
        }
    });
}

错误是无法读取属性＆＃39;状态＆＃39;未定义的

LoginAuth = (Res) => {
    if (Res.username === this.state.Username && Res.password === this.state.Password) {
        return (
            this.setState({
                isLoggedIn: true,
            }, function () {
            }),
            this.hideModal()
        );
    } else {
        console.log("Gets to login auth and false");
    }
}
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.every(function (Res) {
        console.log("ID=" + Res.id);
        console.log("Username=" + Res.username);
        console.log("Password=" + Res.password);
        return (
            self.LoginAuth(Res)
        );
    });
}

循环但在第一个停止时会出现真或假

Answer 1

无法停止执行forEach()。事实上，MDN州：

除了抛出异常之外，无法停止或中断forEach()循环。如果您需要此类行为，forEach()方法是错误的工具。请改用普通循环。如果要测试谓词的数组元素并需要布尔返回值，则可以改为使用every()或some()。

因此，正如建议的那样，您可以使用some()代替。

some()为数组中的每个元素执行一次callback函数，直到找到一个回调返回 truthy 值的值（转换为true时变为true的值）一个布尔）。如果找到这样的元素，some()会立即返回true。否则，some()会返回false。

所以你的功能可以写成：

this.props.AuthRes.some(function (Res) {
    return (
        console.log("ID=" + Res.id),
        console.log("Username=" + Res.username),
        console.log("Password=" + Res.password),
        self.LoginAuth(Res)
    );
});

一旦回调返回true，这将停止迭代，或者直到你用尽迭代的元素。

修改

要解决Cannot read property 'state' of undefined错误，最简单的方法是使用箭头函数：

this.props.AuthRes.some((Res) => {

Answer 2

我已经修好了它

我的代码是

LoginAuth = (Res) => {
if (Res.username === this.state.Username && Res.password === this.state.Password) {
    return (
        this.setState({
            isLoggedIn: true,
        }, function () {
        }),
        this.hideModal()
    );
} else {
    console.log("Gets to login auth and false");
}
}
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.every(function (Res) {
        console.log("ID=" + Res.id);
        console.log("Username=" + Res.username);
        console.log("Password=" + Res.password);
        return (
            self.LoginAuth(Res)
        );
    });
}

现在是

LoginAuth = (Res) => {
    if (Res.username === this.state.Username && Res.password === this.state.Password) {
            this.setState({
                isLoggedIn: true,
            })

            this.hideModal();
            return true;
    } else {
        console.log("Gets to login auth and false");
        return null;
    }
}
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.some(function (Res) {
        console.log("ID=" + Res.id);
        console.log("Username=" + Res.username);
        console.log("Password=" + Res.password);
        return self.LoginAuth(Res);
    });
}

我没有返回真值或虚假值

匹配发生时，React js会中断

2 个答案: