<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="" />
<script src="v.js"></script>
</head>
<style>
</style>
<body>
<div id="root"></div>
</body>
<script>
function l(e) {
console.log(e)
}
const app = Vue.createApp({
data(){
return {
num:100,
num2:100
}
},
methods:{
},
template:`
<div>
<counter v-model:count="num" v-model:app="num2" />
</div>
`
})
app.component('counter',{
props:['count','app'],
methods:{
handleClick(){
this.$emit('update:count',this.count+3)
},
handleClick2(){
this.$emit('update:app',this.app+30)
}
},
template:`<div @click="handleClick">{{count}}</div>
<div @click="handleClick2">{{app}}</div>
`
})
const vm = app.mount("#root")
</script>
</html>
