1、v-on:change="(...list) => change(1234, ...list)"
2、v-on:change="change(1234, ...arguments)"
效果图.png
<!DOCTYPE html>
<html lang="en">
<head>
<title>Static Template</title>
</head>
<body>
<div id="parent">
{{ args }} <br />
<div id="parent">
{{ args }} <br />
<button-counter
v-on:change="(...list) => change(1234, ...list)"
></button-counter>
<!-- <button-counter v-on:change="change(1234, ...arguments)"></button-counter> -->
</div>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.min.js"></script>
<script>
Vue.component("button-counter", {
template: '<button v-on:click="emit_event">button</button>',
methods: {
emit_event: function () {
this.$emit("change", "v1", "v2", "v3"); // Here I emit multiple value
}
}
});
new Vue({
el: "#parent",
data: {
args: ""
},
methods: {
change: function (...args) {
this.args = args;
console.log(args);
}
}
});
</script>
</html>
https://codesandbox.io/s/gracious-torvalds-2hisl9
网友评论