자식 구성 요소에서 상위 구성 요소로 데이터를 전달하기 위해 Emit 기능을 사용하고 코드에서 어떻게 진행되는지 보여드리겠습니다
하위 구성 요소에서 Emit 기능을 시작합니다
<템플릿> <div> <div> <p>이제 상위 구성 요소에 전달할 수 있습니다<br> </p> <pre class="brush:php;toolbar:false"><템플릿> <div> <div> <p>결과는</p> <p><img src="https://img.php.cn/upload/article/000/000/000/173201082567193.jpg" alt="Vue JS Emit function" /></p> <p>어떻게 작동하는지 알아봅시다</p> <p>- "vue"에서 {defineEmits, ref}를 가져옵니다. vue에서 필요한 항목 가져오기<br> - const 개수=ref(0); 검증 가능 항목을 생성하고 ref를 사용하여 기본값을 제공 <br> <br> - const 방출=defineEmits(); 모든 검증 가능<br>에서 DefineEmits를 선언해야 합니다. - const 사용자=[<br> {id:1, 이름:"khusi", 나이:20, 직업:"IT"},<br> {id:1, 이름:"khusi", 나이:20, 직업:"IT"},<br> {id:1, 이름:"khusi", 나이:20, 직업:"IT"},<br> {id:1, 이름:"khusi", 나이:20, 직업:"IT"},<br> ] 모든 데이터에서 사용<br> - const sendDate=()=>{<br> 방출("카운터", 11);<br> 방출("사용자", 사용자);<br> } 우리는 함수를 생성하고 첫 번째 선택적 숫자에 이를 제공하고 두 번째는 DefineEmits 내부의 데이터를 제공하고 문자열에는 상위 구성 요소에서 사용할 선택적 이름을 작성합니다<br> 그리고 Parent 컴포넌트에서 호출하는 방법을 배웁니다 <p>-const submitEmit=(e)=>{<br> console.log(e);<br> Emit("counter", e) <br> }<br> -const submitUser=(e)=>{<br> console.log(e);<br> Emit("사용자", e);<br> } 두 개의 함수가 생성되었으며 그 안에서 하위 구성 요소의 방출 변수를 호출하고 이름과 e를 지정합니다. 이 경우 e=선택적인 숫자인 11과 데이터<br> - <ComponentD @counter="submitEmit" @users="submitUser"/> 마지막으로 방출 옵션 이름 아래에 두 개의 함수를 호출하고 콘솔에서 결과를 볼 수 있습니다</p> <p>관심 가져주신 모든 분들께 감사드립니다</p>
위 내용은 Vue JS 방출 기능의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!