자식 구성 요소에서 부모 구성 요소로 계산된 데이터를 가져올 수 있는가?

자식 구성 요소에서 부모 구성 요소로 계산된 데이터를 가져올 수 있는가?

하위 구성 요소에서 상위 구성 요소로 계산된 데이터를 가져올 수 있는 방법이 있는가?왜냐하면 나는 먼저 부모로부터 자식에게 데이터를 보내고 그 다음에는 부모 구성 요소에 있는 comated property(데이터)를 사용하고 싶기 때문이다.그 중요한 부품(자식)을 다른 부품에도 재사용하고 싶기 때문에 그렇게 하고 싶다.

내 항목을 필터링하기 위한 검색 입력 필드가 있는데, 뭔가를 적으면 하위 구성 요소에서 목록을 다시 받고 싶다.

상위 구성요소

<input class="form-control form-control-search m-input" autocomplete="off" type="text" v-on:input='testFunc()' v-model="search" placeholder="Search...">
<paginate-links v-if="items.length > 0" :models="items">
  <div class="m-list-timeline__item no-timeline" v-for="item in filterItems" v-bind:key="item.id">
    {{ item.title }}
  </div>
</paginate-links>

하위 구성 요소

props: ['item']
computed: {
    filterItems () {
      return filter // here goes my code
    }
}

그래서 내가 그 일을 할 수 있을까?filterItems부모 구성 요소에서?

부모에게 데이터를 다시 보낼 수 있는 몇 가지 방법이 있지만, 아마도 내가 말하는 가장 쉬운 방법은 계산된 내 배출물을 사용하는 것이다.

하위 항목:

computed:{
  myVal() {
    let temp = this.num + 1;
    this.$emit('onNumChange', temp);
    return temp;
  }
}

상위 템플릿에서:

<my-child-component @onNumChange="changeHandler"/>

상위 문자로

methods: {
  changeHandler(value) {
    console.log('Value changed to: ', value);
  }
}

비슷한 일을 할 수도 있다.watch또는 부모에게 통지하는 소품으로 부모로부터 함수를 전달하지만, 내가 추천하는 방법은 vuex를 사용하는 것이다.

https://vuex.vuejs.org/en/

참조URL: https://stackoverflow.com/questions/50413352/can-i-get-computed-data-from-child-component-to-parent-component