Question

handleCommentChange = (e) => {
    const commentID = idGenerator();
    this.setState({
        movie: {
            movieId: this.props.match.params.id,
            ...this.props.movie,           
            comments:[
                ...this.props.movie.comments,
                {     
                    commentID: commentID,
                    by:this.props.profile.firstName,                   
                    userID: this.props.auth.uid,
                    createdAt: new Date(),
                    comment: e.target.value               
                }               
            ]
        },


        profile:{
            ...this.props.profile,
            comments:[
                ...this.props.profile.comments,
                {                              
                    movieId: this.props.match.params.id,
                    commentID: commentID,                                             
                    createdAt: new Date(),
                    comment: e.target.value               
                }
            ]                           

        }
    })
}

这是在两个Firebase集合中添加注释的代码。如果“ this.props.movie.comments”在数组中包含项，则一切工作正常。如果该数组为空，问题就开始了。

如果该数组为空，如何跳过该扩展函数？

我这样做正确吗？

谢谢

Answer 1

我认为最简单的方法是空检查，因为空数组仍然可以在构造函数中或此处传播。您可以通过将本地常量设置为数组或空数组来实现，而无需重复代码。

const movieComments = this.props.movies ? this.props.movies : [];
this.setState({
    movie: {
        movie: {
        movieId: this.props.match.params.id,
        ...this.props.movie,           
        comments:[
            ...movieComments,
            {     
                commentID: commentID,
                by:this.props.profile.firstName,                   
                userID: this.props.auth.uid,
                createdAt: new Date(),
                comment: e.target.value               
            }               
        ]
    },
    profile:{
        ...this.props.profile,
        comments:[
            ...this.props.profile.comments,
            {                              
                movieId: this.props.match.params.id,
                commentID: commentID,                                             
                createdAt: new Date(),
                comment: e.target.value               
            }
        ]                           

    }
});

如果您在this.props.profile.comments处有相同的行为，则可能会发生相同的事情。通常，我将确保始终将其传递为空数组或填充数组，而不是传递null作为道具。

Answer 2

我在需要时选择它。

xpd=NA

setState =>如果不为空则不要展开数组-React

2 个答案: