Question

我早些时候问过类似的问题，但没有得到太多回报。我有两种用于用户身份验证的模式：加入和登录。每个模式都有到另一个的链接。当您单击“注册”并切换到联接模式时，显示的登录错误仍然存在，反之亦然。我试图将state.errors设置为空数组，但错误仍然存在。我将handleSwitch更改为回调。错误数组仍然有长度。我尝试使用switch作为状态的一部分，在handleSwitch和三进制中将其重置为true，也没有结果。有人可以提出替代解决方案吗？

import React from 'react';

class Login extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            email: '',
            password: '',
            errors: [],
            switched: false
        };
        this.handleSubmit = this.handleSubmit.bind(this);
        this.handleSwitch = this.handleSwitch.bind(this);
        this.mapErrors = this.mapErrors.bind(this);
        this.handleErrors = this.handleErrors.bind(this);
    }

    componentDidMount() {
        this.setState({ errors: this.props.errors})
    }

    componentDidUpdate(prev) {
        if (prev.errors.length !== this.props.errors.length) {
            this.setState( {errors: this.props.errors} )
        }
    }

    handleInput(type) {
        return (err) => {
            this.setState({ [type]: err.currentTarget.value })
        };
    }

    handleSubmit(event) {

        event.preventDefault();
        const user = Object.assign({}, this.state);
        this.props.processForm(user)
            // .then(() => this.props.history.push('/users')); //change to /videos later
    }

    handleSwitch() {
        // debugger
        this.setState({ errors: [] }, function () {
            this.props.openModal('signup')
        });
        // debugger
    }

    mapErrors() {
        if (this.state.errors.length) {
            return this.state.errors.map((error, i) => {
                return <p key={i}>{error}</p>
            })
        }
    }

    handleErrors() {
        debugger
        if (!this.state.switched) {
            return <div className="errors">{this.mapErrors}</div>
        } else {
            return null;
        }
    };


    render() {
        console.log(this.state.errors)
        return (
            <div className="login-form">
                <div>
                    <h2 className="login-header">Log in to Foxeo</h2>
                </div>
                <form>
                    <input className="login-email"
                        type="text"
                        value={this.state.email}
                        placeholder="Email address"
                        onChange={this.handleInput('email')}
                    />
                    <input className="login-password"
                        type="password"
                        value={this.state.password}
                        placeholder="Password"
                        onChange={this.handleInput('password')}
                    />
                    
                    <div className="errors">{this.mapErrors()}</div>
                
                
                    {/* { this.state.switched ? 
                        <div className="errors">{this.handleErrors()}</div> :
                        <div className="errors">{this.mapErrors()}</div>
                    } */}
            
                    
                    <button className="login-button" onClick={this.handleSubmit}>Log in with email</button>

                    <div className="login-footer">Don't have an account?
                        {/* <button className="login-form-btn" onClick={() => this.props.openModal('signup')}>Join</button> */}
                        <button className="login-form-btn" onClick={ this.handleSwitch}> Join</button>
                    </div>
                </form>
            </div>
        );
    }
};

export default Login;

Answer 1

我建议从道具中获取新的错误，而不是从状态中获取新的错误：

    mapErrors() {
        if (this.props.errors.length) {
            return this.props.errors.map((error, i) => {
                return <p key={i}>{error}</p>
            })

Answer 2

调度resetErrors操作解决了该问题。 handleSwitch方法非常简单：

def some_public_only_view(request):

    if connection.schema_name == get_public_schema_name():
         # do stuff
         # returns a good view, 200
    else:
         raise Http404

会话操作：

with patch.object('tenant.views.connection', 'schema_name', get_public_schema_name()):

会话错误减少器：

AttributeError: tenant.views.connection does not have the attribute 'schema_name'

setState不重置状态/在模态之间切换

2 个答案: