Vue에서 Emit의 사용법은 무엇입니까

Vue에서는 하위 구성 요소가 상위 구성 요소의 메서드를 호출하고 데이터를 전달하는 데 사용됩니다. 하위 구성 요소는 "$emit"를 사용하여 상위 구성 요소의 사용자 정의 이벤트를 트리거할 수 있습니다. 리스너 콜백에 대한 구문은 "vm.$emit(event, arg)"입니다.

이 기사의 운영 환경: Windows 10 시스템, Vue 버전 2.9.6, DELL G3 컴퓨터.

vue에서 Emit의 사용법은 무엇입니까?

vue에서 $emit의 정의는 다음을 참조하세요.

vm.$emit( eventName, […args] )

매개변수:

{string} eventName

[...args]

이벤트를 트리거합니다. 현재 인스턴스. 추가 매개변수가 리스너 콜백에 전달됩니다.

1. 상위 구성 요소는 소품을 사용하여 하위 구성 요소에 데이터를 전달할 수 있습니다.

2. 하위 구성 요소는 $emit를 사용하여 상위 구성 요소의 사용자 정의 이벤트를 트리거할 수 있습니다.

vm.$emit(event, arg) //현재 인스턴스에서 이벤트 트리거

vm.$on(event, fn); //이벤트 이벤트를 수신한 후 fn을 실행합니다. 컴포넌트:

<template>  
  <div class="train-city">  
    <h3>父组件传给子组件的toCity:{{sendData}}</h3>   
    <br/><button @click=&#39;select(`大连`)&#39;>点击此处将‘大连’发射给父组件</button>  
  </div>  
</template>  
<script>  
  export default {  
    name:&#39;trainCity&#39;,  
    props:[&#39;sendData&#39;], // 用来接收父组件传给子组件的数据  
    methods:{  
      select(val) {  
        let data = {  
          cityname: val  
        };  
        this.$emit(&#39;showCityName&#39;,data);//select事件触发后，自动触发showCityName事件  
      }  
    }  
  }  
</script>

【관련 추천: "

vue.js tutorial

"】

위 내용은 Vue에서 Emit의 사용법은 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!