как реализовать кнопку «Нравится»?

#javascript #node.js #reactjs #express #mern

Вопрос:

Я использую localstorage для хранения идентификатора пользователя, а затем отправляю его в состояние, затем использую его, чтобы скрыть кнопку «Нравится» после нажатия на нее, но после нажатия кнопки «Нравится» она не исчезает, и пользователю может продолжать нравиться сообщение(много раз).

Код для входа: Здесь я сохраняю пользователя в локальном хранилище и отправляю его.

                localStorage.setItem("user",JSON.stringify(data.user))
               dispatch({type:"USER",payload:data.user})
               history.push('/c')
 

Код пользователя:

 export const initialState = null

export const reducer = (state,action)=>{
    if(action.type==="USER"){
        return action.payload
    }
   return state
}
 

Как функциональность:

 const likePost = (id)=>{
            fetch('/post/like',{
                method:"put",
                headers:{
                Accept:"application/json",
                "Content-Type":"application/json",
            },
                body:JSON.stringify({
                    postId:id
                })
            }).then(res=>res.json())
            .then(result=>{
                //console.log(result)
                const newData = data.map(post=>{
                    if(post._id===result._id){
                        return result
                    }else{
                        return post
                    }
                })
                setdata(newData)
            }).catch(err=>{
                console.log(err)
            })
        }
 

код интерфейса:

 {posts.likes.includes(state._id)
                   ?<AiTwotoneDislike size="2em" onClick={()=>{unlikePost(posts._id)}}/>
                   :<AiFillLike size="2em" onClick={()=>{likePost(posts._id)}}/>
                    }
 

Основная проблема заключается только в приведенном выше коде, он принимает состояние._id, но показывает кнопку «Нравится» только после нажатия. Я проверил состояние, оно действительно содержит _id.

Комментарии:

1. Пожалуйста, поделитесь минимальным воспроизводимым кодом.

2. @SinanYaman, пожалуйста, проверьте сейчас

3. Разве это не posts массив? posts._id в этом случае не будет существовать. Вы должны нанести его на карту

4. @SinanYaman Я уже сделал data.map(сообщения=> {}, а затем написал код под ним.

5. Нет , я имею в виду, что ты звонишь likePost(posts._id) , где ты берешь сообщения? Это массив? Если это одна запись, для именования переменной может использоваться рефактор.