Javascript 承诺中的组件未捕获错误

我有一个功能，我需要按设定的顺序启动，这样我就可以从登录用户那里接收书籍。现在这个功能部分工作。当我刷新页面时，它不工作。它说承诺中有一个未可知的错误。我需要在控制台日志触发之前完成getBooks函数。这是怎么写的

async componentDidMount() {
     this.props.getBooks({
        user: this.props.auth.user.id
    
    })

    const wishlistbooks = this.props.auth.wishlistbooks;
    console.log(`WISHLIST:${wishlistbooks[0].book.title}`)
}

getBooks方法

export const getBooks = (user) => dispatch => {

    axios
        .get("/api/users/wishlist", {
            params: {
                id: user
            }
        })
  
        .then(res => {
            const response = res.data;
            dispatch(setWishlist(response));
        })

        // .then(response => {
        //     console.log(response)

        //     dispatch(setWishlist({response}))
        // })

        .catch(() =>{
            console.log("Error!")
        })
    };
    
    export const setWishlist = response => {
        console.log(response)
        return {
            type: WISHLIST_LOADING,
            payload: response
        };
    };

要么a）将异步数据的触发与该数据的使用分开，要么b）将其简化为异步性质，并等待它结束

在第一种情况下，使用数据（您的console.log）将在

render

方法中处理。在这种情况下，渲染方法需要能够处理没有可用数据的渲染（例如，渲染

加载…

消息或其他内容）

---

你为什么要选择其中一个呢？第一种情况对于渲染更有用。如果您获取的数据是您用来显示的数据，那么您需要处理您没有数据的时间。第二种情况对于仅在内部使用的数据更有用。（可能是日志记录或度量，或者您只是在测试某些东西是如何工作的。）

错误的详细信息是什么？在父组件中显示getBooks方法代码错误-无法读取未定义的属性“book”。只是在问题中添加了getBooks方法您在尚未加载wishlist时记录了wishlist，只需在代码中添加一个条件

if（wishlistbooks.lenght）

例如，在getBooks中的函数中，您必须在触发此方法的componentdidmount函数中返回promise对象并添加Wait，我相信这应该会起作用。否则它会给你未定义的数据。谢谢你的解释！第一个病例听起来像是我要找的。但是，如果我刷新页面，那么数据将不会显示，因为没有调用getBooks，这是我当前遇到的问题。第二个选项工作得很好。我确实希望最终显示数据。你能再解释一下为什么wait方法不适合这个吗？

wait

也不错，只是没有关系。它不允许您自动显示数据。之后需要

setState

才能实现这一点。这有点愚蠢b/c你已经在道具中有了这些数据，为什么要将其设置为状态？看起来你在用Redux？如果是这样的话，mapStateToProps函数应该适当地更新道具，以便该组件重新加载。如果没有发生这种情况（看起来好像没有发生什么？），很可能它是在变异

props.auth

，而不是用副本替换它。没有更多的信息很难说。

  render() {
    if (!this.props.auth.wishlistbooks) {
      return 'Loading...'
    }
    
    const wishlistbooks = this.props.auth.wishlistbooks;
    return <>WISHLIST: {wishlistbooks[0].book.title}
  }