fix(compiler-core/v-on): pass noninitial arguments in cached event ha…

…ndlers (#1265)
vuejs · Jun 15, 2020 · 7e28173 · 7e28173
1 parent 35dbef2
commit 7e28173
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 10 deletions.
diff --git a/packages/compiler-core/__tests__/transforms/__snapshots__/hoistStatic.spec.ts.snap b/packages/compiler-core/__tests__/transforms/__snapshots__/hoistStatic.spec.ts.snap
@@ -209,7 +209,7 @@ export function render(_ctx, _cache) {
  return (_openBlock(), _createBlock(\\"div\\", null, [
  _createVNode(\\"div\\", null, [
  _createVNode(\\"div\\", {
- onClick: _cache[1] || (_cache[1] = $event => (_ctx.foo($event)))
+ onClick: _cache[1] || (_cache[1] = ($event, ...args) => (_ctx.foo($event, ...args)))
  })
  ])
  ]))

diff --git a/packages/compiler-core/__tests__/transforms/vOn.spec.ts b/packages/compiler-core/__tests__/transforms/vOn.spec.ts
@@ -142,7 +142,7 @@ describe('compiler: transform v-on', () => {
  key: { content: `onClick` },
  value: {
  type: NodeTypes.COMPOUND_EXPRESSION,
- children: [`$event => (`, { content: `i++` }, `)`]
+ children: [`($event, ...args) => (`, { content: `i++` }, `)`]
  }
  }
  ]
@@ -160,7 +160,11 @@ describe('compiler: transform v-on', () => {
  // should wrap with `{` for multiple statements
  // in this case the return value is discarded and the behavior is
  // consistent with 2.x
- children: [`$event => {`, { content: `foo();bar()` }, `}`]
+ children: [
+ `($event, ...args) => {`,
+ { content: `foo();bar()` },
+ `}`
+ ]
  }
  }
  ]
@@ -196,7 +200,7 @@ describe('compiler: transform v-on', () => {
  value: {
  type: NodeTypes.COMPOUND_EXPRESSION,
  children: [
- `$event => (`,
+ `($event, ...args) => (`,
  {
  type: NodeTypes.COMPOUND_EXPRESSION,
  children: [
@@ -226,7 +230,7 @@ describe('compiler: transform v-on', () => {
  value: {
  type: NodeTypes.COMPOUND_EXPRESSION,
  children: [
- `$event => {`,
+ `($event, ...args) => {`,
  {
  children: [
  { content: `_ctx.foo` },
@@ -400,7 +404,11 @@ describe('compiler: transform v-on', () => {
  index: 1,
  value: {
  type: NodeTypes.COMPOUND_EXPRESSION,
- children: [`$event => (`, { content: `_ctx.foo($event)` }, `)`]
+ children: [
+ `($event, ...args) => (`,
+ { content: `_ctx.foo($event, ...args)` },
+ `)`
+ ]
  }
  })
  })
@@ -444,7 +452,7 @@ describe('compiler: transform v-on', () => {
  value: {
  type: NodeTypes.COMPOUND_EXPRESSION,
  children: [
- `$event => (`,
+ `($event, ...args) => (`,
  { children: [{ content: `_ctx.foo` }, `++`] },
  `)`
  ]

diff --git a/packages/compiler-core/src/transforms/vOn.ts b/packages/compiler-core/src/transforms/vOn.ts
@@ -83,9 +83,9 @@ export const transformOn: DirectiveTransform = (
  // avoiding the need to be patched.
  if (isCacheable && isMemberExp) {
  if (exp.type === NodeTypes.SIMPLE_EXPRESSION) {
- exp.content += `($event)`
+ exp.content += `($event, ...args)`
  } else {
- exp.children.push(`($event)`)
+ exp.children.push(`($event, ...args)`)
  }
  }
  }
@@ -102,7 +102,7 @@ export const transformOn: DirectiveTransform = (
  if (isInlineStatement || (isCacheable && isMemberExp)) {
  // wrap inline statement in a function expression
  exp = createCompoundExpression([
- `$event => ${hasMultipleStatements ? `{` : `(`}`,
+ `($event, ...args) => ${hasMultipleStatements ? `{` : `(`}`,
  exp,
  hasMultipleStatements ? `}` : `)`
  ])