fix(compiler-vapor): event handler
This commit is contained in:
parent
9e9703d7b6
commit
f907a2a708
|
@ -87,28 +87,28 @@ export function render(_ctx) {
|
|||
const t0 = _template(\\"<a></a><form></form><a></a><div></div><div></div><a></a><div></div><input><input><input><input><input><input><input><input><input><input><input><input><input><input><input>\\")
|
||||
const n0 = t0()
|
||||
const { 0: [n1], 1: [n2], 2: [n3], 3: [n4], 4: [n5], 5: [n6], 6: [n7], 7: [n8], 8: [n9], 9: [n10], 10: [n11], 11: [n12], 12: [n13], 13: [n14], 14: [n15], 15: [n16], 16: [n17], 17: [n18], 18: [n19], 19: [n20], 20: [n21], 21: [n22],} = _children(n0)
|
||||
_on(n1, \\"click\\", _withModifiers(_ctx.handleEvent, [\\"stop\\"]))
|
||||
_on(n2, \\"submit\\", _withModifiers(_ctx.handleEvent, [\\"prevent\\"]))
|
||||
_on(n3, \\"click\\", _withModifiers(_ctx.handleEvent, [\\"stop\\", \\"prevent\\"]))
|
||||
_on(n4, \\"click\\", _withModifiers(_ctx.handleEvent, [\\"self\\"]))
|
||||
_on(n5, \\"click\\", _ctx.handleEvent, { capture: true })
|
||||
_on(n6, \\"click\\", _ctx.handleEvent, { once: true })
|
||||
_on(n7, \\"scroll\\", _ctx.handleEvent, { passive: true })
|
||||
_on(n8, \\"contextmenu\\", _withModifiers(_ctx.handleEvent, [\\"right\\"]))
|
||||
_on(n9, \\"click\\", _withModifiers(_ctx.handleEvent, [\\"left\\"]))
|
||||
_on(n10, \\"mouseup\\", _withModifiers(_ctx.handleEvent, [\\"middle\\"]))
|
||||
_on(n11, \\"contextmenu\\", _withModifiers(_ctx.handleEvent, [\\"right\\"]))
|
||||
_on(n12, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"enter\\"]))
|
||||
_on(n13, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"tab\\"]))
|
||||
_on(n14, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"delete\\"]))
|
||||
_on(n15, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"esc\\"]))
|
||||
_on(n16, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"space\\"]))
|
||||
_on(n17, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"up\\"]))
|
||||
_on(n18, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"down\\"]))
|
||||
_on(n19, \\"keyup\\", _withKeys(_ctx.handleEvent, [\\"left\\"]))
|
||||
_on(n20, \\"keyup\\", _withModifiers(_ctx.submit, [\\"middle\\"]))
|
||||
_on(n21, \\"keyup\\", _withModifiers(_ctx.submit, [\\"middle\\", \\"self\\"]))
|
||||
_on(n22, \\"keyup\\", _withKeys(_withModifiers(_ctx.handleEvent, [\\"self\\"]), [\\"enter\\"]))
|
||||
_on(n1, \\"click\\", _withModifiers((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"stop\\"]))
|
||||
_on(n2, \\"submit\\", _withModifiers((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"prevent\\"]))
|
||||
_on(n3, \\"click\\", _withModifiers((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"stop\\", \\"prevent\\"]))
|
||||
_on(n4, \\"click\\", _withModifiers((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"self\\"]))
|
||||
_on(n5, \\"click\\", (...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), { capture: true })
|
||||
_on(n6, \\"click\\", (...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), { once: true })
|
||||
_on(n7, \\"scroll\\", (...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), { passive: true })
|
||||
_on(n8, \\"contextmenu\\", _withModifiers((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"right\\"]))
|
||||
_on(n9, \\"click\\", _withModifiers((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"left\\"]))
|
||||
_on(n10, \\"mouseup\\", _withModifiers((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"middle\\"]))
|
||||
_on(n11, \\"contextmenu\\", _withModifiers((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"right\\"]))
|
||||
_on(n12, \\"keyup\\", _withKeys((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"enter\\"]))
|
||||
_on(n13, \\"keyup\\", _withKeys((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"tab\\"]))
|
||||
_on(n14, \\"keyup\\", _withKeys((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"delete\\"]))
|
||||
_on(n15, \\"keyup\\", _withKeys((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"esc\\"]))
|
||||
_on(n16, \\"keyup\\", _withKeys((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"space\\"]))
|
||||
_on(n17, \\"keyup\\", _withKeys((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"up\\"]))
|
||||
_on(n18, \\"keyup\\", _withKeys((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"down\\"]))
|
||||
_on(n19, \\"keyup\\", _withKeys((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"left\\"]))
|
||||
_on(n20, \\"keyup\\", _withModifiers((...args) => (_ctx.submit && _ctx.submit(...args)), [\\"middle\\"]))
|
||||
_on(n21, \\"keyup\\", _withModifiers((...args) => (_ctx.submit && _ctx.submit(...args)), [\\"middle\\", \\"self\\"]))
|
||||
_on(n22, \\"keyup\\", _withKeys(_withModifiers((...args) => (_ctx.handleEvent && _ctx.handleEvent(...args)), [\\"self\\"]), [\\"enter\\"]))
|
||||
return n0
|
||||
}"
|
||||
`;
|
||||
|
@ -120,7 +120,7 @@ export function render(_ctx) {
|
|||
const t0 = _template(\\"<div></div>\\")
|
||||
const n0 = t0()
|
||||
const { 0: [n1],} = _children(n0)
|
||||
_on(n1, \\"click\\", _ctx.handleClick)
|
||||
_on(n1, \\"click\\", (...args) => (_ctx.handleClick && _ctx.handleClick(...args)))
|
||||
return n0
|
||||
}"
|
||||
`;
|
||||
|
@ -259,7 +259,7 @@ export function render(_ctx) {
|
|||
_prepend(n4, n1)
|
||||
_insert(n2, n4, n5)
|
||||
_append(n4, n3)
|
||||
_on(n4, \\"click\\", _ctx.handleClick)
|
||||
_on(n4, \\"click\\", (...args) => (_ctx.handleClick && _ctx.handleClick(...args)))
|
||||
_effect(() => {
|
||||
_setText(n1, undefined, _ctx.count)
|
||||
})
|
||||
|
|
|
@ -23,7 +23,7 @@ return (() => {
|
|||
_append(n2, n1)
|
||||
const n3 = _createTextNode(double.value)
|
||||
_append(n4, n3)
|
||||
_on(n5, \\"click\\", increment)
|
||||
_on(n5, \\"click\\", (...args) => (increment && increment(...args)))
|
||||
const n7 = _createTextNode(count.value)
|
||||
_setText(n7, undefined, count.value)
|
||||
_append(n8, n7)
|
||||
|
|
|
@ -446,7 +446,14 @@ function genSetEvent(oper: SetEventIRNode, context: CodegenContext) {
|
|||
if (nonKeys.length) {
|
||||
push(`${vaporHelper('withModifiers')}(`)
|
||||
}
|
||||
|
||||
// gen event handler
|
||||
push('(...args) => (')
|
||||
genExpression(oper.value, context)
|
||||
push(' && ')
|
||||
genExpression(oper.value, context)
|
||||
push('(...args))')
|
||||
|
||||
if (nonKeys.length) {
|
||||
push(`, ${genArrayExpression(nonKeys)})`)
|
||||
}
|
||||
|
|
|
@ -0,0 +1,20 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, watchEffect } from 'vue'
|
||||
|
||||
const count = ref(0)
|
||||
const inc = () => count.value++
|
||||
const dec = () => count.value--
|
||||
const handler = ref(inc)
|
||||
|
||||
watchEffect(() => {
|
||||
if (count.value > 5) {
|
||||
handler.value = dec
|
||||
} else if (count.value < -5) {
|
||||
handler.value = inc
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<button @click="handler">{{ count }}</button>
|
||||
</template>
|
Loading…
Reference in New Issue