Javascript 反应状态/道具赢得'；t更新

我有下面的代码，但我的状态不会更新。 我使用AngularHTTP ajax调用来接收用户是否正确。当我将新的错误消息作为道具传递时，不会发生任何事情，但组件确实会收到它，因为我可以通过

nextProps

访问它

我还尝试跳过

构造函数

，

组件将接收props

和

应组件更新

，只渲染出

{this.props.error}

，但这也不起作用

这是我第一次渲染DOM的渲染函数

// Some code

.then(function(response){
   // Some code
}, function(response){
   _this.renderLogin("User not found"); // Is sending the error-message to the function 
});

// Some code

_this.renderLogin = function(error){
   render(
      <Login error={error} />,
      document.getElementById("app")
   );
};
_this.renderLogin("Standard");

//一些代码
.然后（功能（响应）{
//一些代码
}，功能（回应）{
_this.renderLogin（“未找到用户”）；//正在向函数发送错误消息
});
//一些代码
_this.renderLogin=函数（错误）{
渲染(
,
document.getElementById（“应用程序”）
);
};
_本文件：renderLogin（“标准”）；

这是登录组件：

class Login extends React.Component {
    constructor(props){
        super(props);
        this.state = {
            error: this.props.error
        }
    }
    componentWillReceiveProps(nextProps) {
        if (nextProps.error !== this.state.error) {
            this.setState({ error: nextProps.error });
            console.log(nextProps.error); // User not found 
            console.log(this.state.error); // Standard
        }else{}
    }
    shouldComponentUpdate(nextProps, nextState){
        console.log(nextState.error); // User not found
        console.log(nextProps.error); // User not found
        console.log(this.state.error); // Standard
        return true;
    }

    render(){
       return(
          <div>
             { this.state.error } // Always showing: 'Standard'
          </div>
       );
    }
}
export default Login;

类登录扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
错误：this.props.error
}
}
组件将接收道具（下一步）{
if（nextrops.error！==this.state.error）{
this.setState（{error:nextProps.error}）；
console.log（nextrops.error）；//找不到用户
console.log（this.state.error）；//标准
}else{}
}
shouldComponentUpdate（下一步，下一步状态）{
console.log（nextState.error）；//找不到用户
console.log（nextrops.error）；//找不到用户
console.log（this.state.error）；//标准
返回true；
}
render（）{
返回(
{this.state.error}//始终显示：“标准”
);
}
}
导出默认登录；

---

提前感谢您的帮助

从我看到的代码来看，

登录不应该是有状态的组件，因为它不会改变状态。。。它只是无缘无故地将接收到的道具设置为其状态。在React状态下，将使用道具向下传递，并在需要使用新道具值更新的组件上触发渲染。您的代码中没有发生任何事情，因为组件已经附加到DOM，但是您正在尝试使用此组件的新值将其重新绑定到DOM

.then（函数（响应）{
//一些代码
}，功能（回应）{
_this.renderLogin（“未找到用户”）；//正在向函数发送错误消息
});

类似的代码需要在有状态的react组件中，该组件评估用户是否登录。状态必须在react组件内发生变异，而不是在试图将其传入的外部发生变异。在下面的代码中，我没有将您的
Login
更改为无状态，但它仍然有效，因为我已在React组件中禁用了该值


类RenderLogin扩展React.Component{
建造师（道具）{
超级（道具）；
此.state={
错误：“标准”，
};
this.changererror=this.changererror.bind（this）；
}
changererror（）{
this.setState（{errors:“Boom”}）；
}
render（）{
返回(
改变
);
}
}
类登录扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
错误：this.props.error
}
}
组件将接收道具（下一步）{
if（nextrops.error！==this.state.error）{
this.setState（{error:nextProps.error}）；
console.log（nextrops.error）；//找不到用户
console.log（this.state.error）；//标准
}else{}
}
shouldComponentUpdate（下一步，下一步状态）{
console.log（nextState.error）；//找不到用户
console.log（nextrops.error）；//找不到用户
console.log（this.state.error）；//标准
返回true；
}
render（）{
返回(
{this.state.error}//始终显示：“标准”
);
}
}
ReactDOM.render（，document.getElementById（'app'））
感谢您对答案的详细描述。有道理：）