The object syntax for events doesn't work in the render function(`h()`)
Sep 25th 2020
Version
3.0.0
Reproduction link
Steps to reproduce
https://github.com/vuejs/vue-next/issues/2227
I have the same doubts as this issue. I don't know why the document said there was such a syntax, but the questions were closed.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="https://unpkg.com/vue@next"></script>
</head>
<body>
<div id="app"></div>
<script>
Vue.createApp({
setup(){
let a = Vue.ref(0);
let b = Vue.ref(0);
return ()=>Vue.h(
"div",
[
Vue.h("button", { onClick: () => a.value }, `function: ${a.value}`),
Vue.h("button", { onClick: {handler: () => b.value } }, `object: ${b.value}`)
]
)
}
}).mount("#app");
</script>
</body>
</html>
What is expected?
The object syntax for events works in the render function.
What is actually happening?
It doesn't work.
Sep 25th 2020
Please answer the question there instead of opening duplicates. It will be reopened if the syntax was meant to work
Sep 25th 2020
This is a mistake in the doc. It should be written in this way
h("button", { onClickOnce: () => b.value++ }, `object: ${b.value}`)
Sep 25th 2020
This is a mistake in the doc. It should be written in this way
h("button", { onClickOnce: () => b.value++ }, `object: ${b.value}`)
If I want to add passive dynamically according to the value of props, can I achieve it? How can I do it?
Sep 25th 2020
string concatenation? 😂
Sep 25th 2020
string concatenation? 😂
I see. I used the following method. Thank you
h("button", { [props.once ? "onClickOnce" : "onClick"]: () => b.value++ }, `object: ${b.value}`)
