vvvvvvue 

<!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>

 

posted on 2021-06-16 00:59  ZKJABLE  阅读(44)  评论(0)    收藏  举报

导航