source

Vue 앱이 VM을 사용할 때 이벤트 청취자에게 추가 매개 변수를 전달할 수 있는 방법은 무엇입니까?$once()?

gigabyte 2022. 8. 18. 23:47
반응형

Vue 앱이 VM을 사용할 때 이벤트 청취자에게 추가 매개 변수를 전달할 수 있는 방법은 무엇입니까?$once()?

Vue 앱에서는 VM을 사용하여 한 번 호출된 이벤트 수신기를 추가할 수 있습니다.$1회.
예를 들어 Vue App의 하위 구성 요소에서는 다음을 사용하여 이벤트를 내보낼 수 있습니다.vm.$emit('myEvent', data)이벤트를 발생시킵니다.

그런 다음 이벤트 청취자를 이 이벤트에 추가하여 처리할 수 있습니다.vm.$onceVue 앱에 있습니다.
이 때 추가 데이터를 이벤트 핸들러에 전달하고 싶습니다.

나는 다음과 같이 시도했다.하지만 그것은 오류를 던진다.

수집되지 않은 참조 오류: $event가 정의되지 않았습니다.

    //In the Vueapp
    this.$refs.child.$once(
      'myEvent', this.eventHandler($event, additional_data)
    );

하지만 제 생각에는 추가 데이터를 사용할 때 전달될 수 있을 것 같습니다.v-on.

  <child-component ref="child" v-on:myEvent="eventHandler($event, additional_data)"></child-component>   
   //$event is the data emitted from the event , "myEvent".

사용시vm.$once또는vm.$on추가 파라미터를 전달할 수 없었습니까?

주의: 사용하는 이유vm.$once이 모든 것을 실행하고 싶다는 것입니다.eventHandler커스텀 이벤트를 내보낼 때 한 번만myEvent를 동적으로 추가합니다.

이벤트 핸들러에 전달된 인수를 캡처해야 합니다.이를 수행하려면 메서드를 호출하는 핸들러에 대해 익명 함수를 사용합니다.예를들면

this.$refs.child.$once('myEvent', $event => {
  this.eventHandler($event, additional_data)
})

또한 다음과 같이 인수 목록을 반전시켜야 할 수도 있습니다.bind는 인수를 부가합니다.

예를들면

methods: {
  eventHandler(data, $event) { // reversed argument list
    // etc
  }
}

그리고.

this.$refs.child.$once('myEvent', this.eventHandler.bind(this, additional_data))

언급URL : https://stackoverflow.com/questions/52396912/how-could-the-vue-app-pass-the-additional-parameters-to-the-event-listener-when

반응형