v-on syntax error, workaround?

Question

v-on syntax error, workaround?

dvic opened this issue 5 years ago · 2 comments

I see that @vue/babel-preset-jsx uses v-on:eventName or vOn:eventName (see https://github.com/vuejs/jsx/tree/dev/packages/babel-sugar-v-on). But I guess this syntax is not supported in TSX because of the double column?

I currently use componentFactoryOf with a methodonEventName() and $emit("eventName") and when I listen with onEventName={...}, this works. But I'm trying to understand why. Are all attributes that start with on put in the on node data object?

Answer 1 · 2019-10-23T09:11:25.000Z

@wonderful-panda is this the recommended approach or is there a better way?

Answer 2 · 2019-10-23T10:35:53.000Z

Sorry for the late response.

is this the recommended approach

Yes. that way is recommended.

babel-preset-jsx will rewrite onXxx={ ... } to {...{ on: { xxx: ... } }}.