Как сопоставить вложенный массив в сопоставленном массиве в редукторе

TLDR: как мне лучше отобразить массив в реквизите initalState

Следующий код, который я пытаюсь попытаться, состоит в том, чтобы получить все postIds из подобного массива и сравнить post.id с like.postId

Однако

like.postId is undefined.

post.id доступен в журнале консоли, разница между сообщениями и лайками заключается в том, что сообщения отображаются на стороне клиента и лайков нет. Итак, я пытаюсь сделать сопоставление в редюсере, потому что мне нужно будет получить количество лайков хранится для каждого поста и сопоставить его с его уважаемым post.id.

Причина, по которой мне нужно было бы установить значения внутри лайков initialState, заключается в том, что мне нужно будет использовать это следующее действие, чтобы голосовать за сообщения.

  case ADD_LIKE:
        // console.info(action.id) // renders post id which is 2
        // console.info(state.posts) // logs posts array
        // console.info(state.posts)
            return {
            ...state,
            likes: state.likes + 1
        };

если я сделаю что-то подобное like[0].postId, он получит значения только для этого like.id. Мне нужно иметь возможность получить все лайки со всех постов, сравнить like.postId с post.id, а затем установить значение.

И получить счет как

{this.props.likes}

просто чтобы понять, как выглядит массив.

Это пример массива сообщений, и в массиве сообщений у вас есть массив лайков.

Вот как я называю посты

export const GetPosts = () => {
    return (dispatch, getState) => {
        return Axios.get('/api/posts/myPosts')
            .then( (res) => {
                 const data = res.data
                 const likes = res.data // gets  the first item within array, and shows likes.
                 const myLikes = likes.map( (post) => {
                    return post.Likes
                 })
                 console.info(myLikes)

                 dispatch({type: GET_POSTS, data, myLikes})
             })

    }
}

редуктор

export default (state = initialState, action) => {
    switch (action.type) {
     case GET_POSTS:
            console.info(action.data[0].Likes.length)
            return {
                ...state, 
                posts: action.data, // maps posts fine
                // set likes to but it only gets the first post, when it should get all posts
                likes: action.data.map( (post) => {
                    action.myLikes.map( (like) => {
                        // if (post.id === like.postId){
                            console.info(like) // renders an array of likes for all posts
                            console.info(like.postId) // renders undefined, 
                        // }
                    })
                })
        }
}

вот как это отображается

PostList.js

render(){
        const {posts} = this.props;
        return (
            <div>
                {posts.map((post, i) => (
                    <Paper key = {post.id} style = {Styles.myPaper}>

                    {/* {...post} prevents us from writing all of the properties out */}
                        <PostItem                     
                             myTitle = {this.state.title} 
                             editChange = {this.onChange} 
                             editForm = {this.formEditing} 
                             isEditing = {this.props.isEditingId === post.id} 
                             removePost = {this.removePost} 
                             {...post} 
                        />
                    </Paper>
                ))}
            </div>
        )
    }

Действие GetPosts вызывается внутри этого компонента

class Posts extends Component {
  state = {
    posts: [],
    loading: true,
    isEditing: false, 
  }
  async componentWillMount(){
    await this.props.GetPosts();
    this.setState({ loading: false })
    const reduxPosts = this.props.myPosts;
    const ourPosts = reduxPosts  
    console.info(reduxPosts); // shows posts line 35
  }

  render() {
    const {loading} = this.state;
    const { myPosts} = this.props
    if (!this.props.isAuthenticated) {
      return (<Redirect to='/signIn' />);
    }
    if (loading){
      return "loading..."
    }
    return (
      <div className = "App" style = {Styles.wrapper}>
        <h1> Posts </h1>
        <PostList posts = {myPosts}/>
      </div>
    );
  }
}
const mapStateToProps = (state) => ({
  isAuthenticated: state.user.isAuthenticated,
  myPosts: state.post.posts
})
const mapDispatchToProps = (dispatch, state) => ({
  GetPosts: () => dispatch( GetPosts())
});
export default withRouter(connect(mapStateToProps,mapDispatchToProps)(Posts));