inflearn logo
강의

講義

知識共有

プロジェクトで学ぶVue.js 3

24 検索機能を追加

24강에서 computed의 종속성이 변경도록 return하는데, 그러면 computed가 다시 실행되나요?

390

admin plitsoft

投稿した質問数 1

0

24강 검색기능 추가의 filteredTodos에서

const filteredTodos = computed(() => {
      if (searchText.value) {
        return todos.value.filter(todo => {
          return todo.subject.includes(searchText.value);
        });
      }

      return todos.value;
    });

제가 알기로 computed는 반응형 종속성 변수가 변경될때마다 실행되는것으로 이해했습니다.

그러면 여기서 반응형 종속성 변수는 todos와 searchText인데
return에서 todos의 value가 변경되므로, computed가 총 두번실행되는 것인가요?

1.searchText 변경을감지하고 computed 실행

2.return 에서 todos.value를 변경

3.todos의 변경을 감지하고 computed 재실행

4.searchText와 todos모두 변경되지 않아 computed종료

vue.js 웹앱 vuex

回答 1

0

communityai8509

안녕하세요, 인프런 AI 인턴이에요.

computed 함수는 여러 종속성 변수를 가질 수 있으며, 그 중 어떠한 변수도 변경되지 않으면 이전에 계산된 값을 재사용합니다. 따라서, 24강에서의 computed 함수에서도 todos와 searchText 변수 중 어느 하나라도 변경되지 않으면 이전에 계산된 값을 사용합니다.

하지만, todos의 경우에는 return 구문 내에서 변경되므로, todos 값이 변경됐을 경우 computed 함수가 한 번 더 호출됩니다. 이후 searchText 값이 변경됐을 경우 computed 함수가 다시 호출되고, 이전과 같은 과정을 반복하게 됩니다.

결론적으로, 24강에서의 computed 함수는 todos와 searchText 두 변수 중 어느 하나라도 변경될 때마다 실행됩니다.

감사합니다.

numberOfPages 결과 nan

0

409

2

todos 질문입니다.

0

280

2

작동은 되긴 하는데 해당 메세지는 왜 뜨는걸까요?

1

358

0

강의노트 문의

0

360

1

x-total-count 및 db.json id값 문제

0

906

1

개발툴 글자체, 크기, 색깔 세팅 문의

0

219

1

onMount 관련 강의가 몇강에 있었죠?ㅠㅠ

0

307

1

json server실행/중지 문의드립니다!

0

475

1

3:53 분에 HelloWorld 태그 인식을 못해서 오류 발생하비낟!

0

458

1

블로그 정리 관련 질문드립니다~

0

423

2

Composition API?

0

390

1

구조가 다름...

0

481

1

59강 API body 질문입니다.

0

294

1

로그인과 같이 레이아웃이 완전 다른 페이지를 만들때는 router 를 어떻게 할까요?

0

431

1

vue CLI 설치 관련 문의드립니다.

0

585

1

31강 DB질문

0

416

1

to와 :to의 차이점

0

442

1

52강의 originalTpdp ref 와 todo ref

0

546

1

delete todo 함수를 prop으로 내려주지 않는 이유는 무엇인가요??

0

405

1

computed 와 검색 기능 추가 질문드려요.

0

442

1

[33강] pagination2 numberOfPages 호출

0

379

1

리렌더링 관련 질문

0

330

1

배포 관련 질문드립니다.

0

307

1

30강 질문드립니다.

0

220

1