SOURCE

<div id="app">
    <ele></ele>    
<div>

<script>
    //Redner写法
    Vue.component('ele',{
        render:function(createElement){
            return createElement(
                'div',
                {
                    //动态绑定class
                    class:{
                        'show':this.show
                    },
                    //普通html特性
                    attrs:{
                        id:'element'
                    },
                    //给div绑定click事件
                    on:{
                        click:this.handleClick
                    }
                },
                '文本内容'
            )
        },
        data:function(){
            return {
                show:true
            }
        },
        methods:{
            handleClick:function(){
                console.log('click')
            }
        }
    })
    //普通模板写法
    // Vue.component('ele',{
    //     template:'\
    //     <div id="element"\
    //     :class="{show:show}"\
    //     @click="handleClick">文本内容</div>',
    //     data:function(){
    //         return{
    //             show:true
    //         }
    //     },
    //     methods:{
    //         handleClick:function(){
    //             console.log('click');
    //         }
    //     }
    // });
    const app = new Vue({
        el:'#app'
    })
</script>