강의

멘토링

로드맵

Inflearn brand logo image

인프런 커뮤니티 질문&답변

이룸님의 프로필 이미지
이룸

작성한 질문수

[리뉴얼] React로 NodeBird SNS 만들기

게시글 구현하기

추후 삭제버튼을 눌러서 filter로 돌릴 경우에

작성

·

185

0

예를 들면 

// 초깃값
const initialState = { 
  posts: [
    {
      id: 1,
      title: 'javacript',
    }
  ]
}

// 컴포넌트 내부에서 초깃값 불러온 뒤
const { post } = useSeletor((state) => state.posts);

// 삭제 함수
const onRemovePost = () => {
  // dispatch
}

<ul>
  {post.map((v) => (
    <li key={v.id}>
      <h2>{v.title}</h2>
      <button onClick={onRemovePost}>삭제</button>
    </li>
  ))}
</ul>

너무 성의없는 예제라면 죄송합니다.

이럴 경우에는 각 li마다 삭제 button이 있는데

버튼을 눌렀다고해서 포스트의 ld값을 어떻게 filter에서

비교를하고 빼는건지 버튼에 어떤 정보가 들어가게 되나요?

너무 답변하기에 무리한 부탁이라면,

어디 강의를 제대로 보면 좋을지라도 말씀주시면 감사하겠습니다 ㅜ

답변 2

1

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

onRemovePost(v.id) 로 바꾸고 나서

const onRemovePost = useCallback((id) => () => {

  dispatch({ type: 'REMOVE_POST', data: id })

}, [])

이런 식으로 해서 id를 REMOVE_POST로 보내고요.

리듀서에서 filtering 하시면 됩니다.

이룸님의 프로필 이미지
이룸
질문자

하... 그렇게 받아올 생각을 못했네요... 감사합니다!

0

이룸님의 프로필 이미지
이룸
질문자

바꾸고나서 실행해보니 삭제는 되지만, 바로 실행이 되버려서

공식문서에서 확인해보니 화살표 함수로 감싸서 해보니 잘 작동되네요 감사합니다^^!

이룸님의 프로필 이미지
이룸

작성한 질문수

질문하기