diff --git a/packages/babel-plugin-transform-vue-jsx/src/index.js b/packages/babel-plugin-transform-vue-jsx/src/index.js index e36143a..40688fb 100644 --- a/packages/babel-plugin-transform-vue-jsx/src/index.js +++ b/packages/babel-plugin-transform-vue-jsx/src/index.js @@ -166,7 +166,15 @@ const parseAttributeJSXAttribute = (t, path, attributes, tagName, elementType) = prefix = prefixes.find(el => name.startsWith(el)) || 'attrs' name = name.replace(new RegExp(`^${prefix}\-?`), '') - name = name[0].toLowerCase() + name.substr(1) + + // in jsx, event binding use Camel case, such as `onClick`, `onMouseDown`; + // in HTML Specification, event binding is all lower case, such as `onclick`, `onmousedown` + // so for `on` and `nativeOn` attribute in jsx, transform `name` to all lower case + if (prefix === 'on' || prefix === 'nativeOn') { + name = name.toLowerCase() + } else { + name = name[0].toLowerCase() + name.substr(1) + } const valuePath = path.get('value') let value