<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>组件基础</title>
</head>
<body>
    <div id="app">
        <greeting to="mike">Hello,</greeting>
        <greeting to="jane">Hello,</greeting>
    </div>

    <script src="../js/vue.js"></script>

    <script>
        Vue.component('greeting',{
            data:function () {
                return {
                    count:0
                }
            },
            props:['to'],
            methods:{
                doClick:function () {
                    this.count++;
                    console.log(this.count);
                }
            },
            template:'<button v-on:click="doClick"><slot></slot>{{to}} x {{count}}</button>',
        });

        let vm = new Vue({
            el:'#app'
        });
    </script>
</body>
</html>