• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

질문있습니다.

19.10.28 17:34 작성 조회수 135

1

--체크하는 메소드

checkItems: function (todoItem,index) {

this.todoItems[index].completed =! this.todoItems[index].completed;

localStorage.setItem(todoItem.item, JSON.stringify(todoItem));

}

안티패턴때문에 위에

this.todoItems[index].completed =! this.todoItems[index].completed;

이 부분에서 App.vue에 선언된 todoItems를 this를 사용하여 코딩하잖아요.

그렇다면 하위컴포넌트에서 $emit으로 가져온 데이터 todoItem,index를 사용하는것도 안티패턴인가요???

이 데이터도 propsdata에 영향을 받은게 아닌가 싶어서 질문 올립니다.

답변 1

답변을 작성해보세요.

1

안녕하세요 후루루룹님,

좋은 질문이네요! 할 일 체크하는 코드 관련해서 질문 주신 것 같은데 결론부터 말씀드리면 todoItem, index를 다른 곳에서 받아 변형하지 않기 때문에 안티 패턴이라고 보지 않으셔도 될 것 같아요..! 특정 컴포넌트의 데이터는 해당 컴포넌트에서만 변경한다는 규칙만 어긋나지 않게 코딩하시면 좋을 것 같습니다 :)