반응형
$emit를 동기식 모드로 실행하고 excast 이벤트에서 결과를 다시 얻을 수 있는가?
동기식 방출로 실행이 가능하고 그 결과를 호출 방식 자체에서 다시 얻을 수 있는가.그래서 나는 $emit이 완료된 후 다음 문장을 실행하고자 한다.다음과 같다.
Parent component has method,
doCustomValidation();
child component is as follow:
methods:
{
Save: function(){
// Can I get the response here from parent component and then, execute
doGenericValidation ?
var errorFields = this.$emit('custom-validation');
doGenericValidation(errorFields); //this is generic validations
}
이것을 동기식으로 만들려고 해서는 안 된다.대신 다음과 같은 아이디어를 사용할 수 있을 것이다.
methods: {
myMethod() {
// Pass a function as a parameter.
this.$emit('custom-validation', this.onComplete);
},
onComplete() {
// Do stuff after custom-validation has completed.
}
}
그런 다음 이벤트를 사용하는 구성 요소:
<some-component @custom-validation="doStuff" />
<script>
...
methods: {
doStuff(done) {
// Your logic here. After that, call the callback function.
done();
}
}
...
배출에 대한 약속 기반 포장지를 만들고 결과를 기다릴 수 있다.
다음은 내 프로젝트를 위해 만든 꽤 일반적인 솔루션이다.
async emitPromised(method, ...params){
let listener = this.$listeners[method] || this.$attrs[method] || this[method]
if(listener){
let res = await listener(...params)
return res === undefined || res
}
return false
},
이제 이렇게 사용할 수 있다.
async onDelete(){
this.isDeleting = true
let res = await this.emitPromised("delete")
this.isDeleting = false
if(res){
this.closeConfirm()
}
},
혼합을 통해 이 방법을 포함하거나 Vue 인스턴스에 전체적으로 연결하여 모든 구성 요소가 액세스할 수 있도록 하십시오.
참고로,$listeners
이 구성 요소에 바인딩된 모든 메서드 저장@
또는v-on
(좋다)<MyComponet @click="onClick"/>
) 동안$attrs
다음을 사용하여 구성 요소에 전달된 모든 내용을 저장하십시오.v-bind
또는:
(좋다)<MyComponet :click="onClick"/>
)
아니요.$emit
항상 대기열에 있을 것이다.또한 다수의 청취자가 있을 수 있기 때문에, 반환 값은 정말로 이치에 맞지 않는다.
해결책으로, 당신은 함수를 속성으로 보낸 다음, 그것을 직접 호출할 수 있다.
반응형
'IT이야기' 카테고리의 다른 글
문자열의 마지막 문자를 얻는 방법은? (0) | 2022.05.05 |
---|---|
Java에서 servlet 필터를 사용하여 들어오는 servlet 요청 URL을 변경하는 방법? (0) | 2022.05.05 |
Eclipse 복사/붙여넣기 전체 줄 바로 가기 키 (0) | 2022.05.05 |
돌연변이를 통해 상태 속성을 동적으로 추가하는 방법 (0) | 2022.05.05 |
소방 기지:페이스북AuthProvider가 생성자가 아님 (0) | 2022.05.05 |