reactjs - API 返回 [object 对象]

Question

我正在尝试在 reactJS 中获取我的 api 请求的主体。它在 submitHandler 函数上返回正确的“主体”，但在不同组件上调用时返回 [object Object]。下面是我的代码:

登录(提交处理程序):

 submitHandler(event) {
        event.preventDefault()
     
        axios
            .post("http://localhost:8000/rest-auth/login/", this.state)
            .then(res => {
                 if (res.data){
                    sessionStorage.setItem('data', res)
                    this.setState({redirect:true})
                }
                console.log(res.data)
            })
            .catch(err => {
                this.setState({
                    error: true, errorMessage: err
                })
                // console.log(this.state.errorMessage)
            })
    }

配置文件(componentDidMount):

 componentDidMount()
    {
        if(sessionStorage.getItem('data')){
         let  user_data = sessionStorage.getItem('data')
            console.log(user_data)
        }
        else {
            this.setState({
                redirect:true
            })
        }
}

componentDidMount 返回 [object Object] 而不是 api 主体响应。

Answer 1

这与 API 无关，这是关于您正在使用的 sessionStorage。

只能在本地存储或 session 存储中存储字符串； setItem API 将在您传入的任何内容上隐式调用 .toString()，对于对象结果为 [object Object]。

您需要将内容编码为例如JSON，即

sessionStorage.setItem('data', JSON.stringify(res.data))

并在加载时对其进行解码，

let user_data = JSON.parse(sessionStorage.getItem('data'))