Skip to content

add eventHandler after component mounted #2155

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
IndexXuan opened this issue Sep 18, 2020 · 9 comments
Closed

add eventHandler after component mounted #2155

IndexXuan opened this issue Sep 18, 2020 · 9 comments

Comments

@IndexXuan
Copy link

What problem does this feature solve?

I am writing VCA called useEventListener,which can be used to addEventListener with native HTML element and $on with Vue Component(2.0 @vue/composition-api)。while in Vue 3.0, there are no $on any more and cannot add new eventHandler after component mounted(e.g. with component ref)

What does the proposed API look like?

<el-button @click="handleClick">click</el-button>,then we can use handleClick
but with
<el-button ref="buttonRef">click me</el-button>

useEventListener('click', evt => alert(1), false, buttonRef) // cannot get buttonRef.$on or set buttonRef.onClick(onXXX) in 3.0

readonly proxy can set onXXX instead of reject with warning message

@posva
Copy link
Member

posva commented Sep 18, 2020

See https://v3.vuejs.org/guide/migration/events-api.html#overview


Hi, thanks for your interest but Github issues are for bug reports and feature requests only. You can ask questions on the forum, the Discord server or StackOverflow.

@posva posva closed this as completed Sep 18, 2020
@IndexXuan
Copy link
Author

@posva bro, I know use other event emitter instead of new Vue. It is feature, not question

buttonRef.$props.onClick = evt => alert(1) not work because of code
https://github.com/vuejs/vue-next/blob/f316a332b055d3f448dc735365551d89041f1098/packages/reactivity/src/baseHandlers.ts#L200

It means if we want add eventHandler, the only way is @click in template, we cannot do the same thing when we got buttonRef in setup. any way ? But in 2.0 is OK

@IndexXuan
Copy link
Author

In native Dom, we can onclick="handleClick" or we can dom.addEventListener as we want

@leopiccionia
Copy link
Contributor

leopiccionia commented Sep 18, 2020

Have you tried something like buttonRef.$el.addEventListener('click', handleClick)?

@IndexXuan
Copy link
Author

@posva this is for component container listener,not component emitted listener

@posva
Copy link
Member

posva commented Sep 18, 2020

The components no longer implement that API: https://v3.vuejs.org/guide/migration/events-api.html#overview it went through an RFC vuejs/rfcs#118

@IndexXuan
Copy link
Author

@posva no way to listen component emitted inside setup?very sad ...

@IndexXuan
Copy link
Author

it should be buttonRef.onClick = comp emitted click event

@IndexXuan
Copy link
Author

#2184
@posva Hi Bro, please review mine

@github-actions github-actions bot locked and limited conversation to collaborators Nov 4, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants