test.vue.js 1.18 KB
/**
 * 第一个Vue组件
 * 使用原生javascript es5标准,不使用es6标准,可以直接使用,不需要转译
 */
var test_vue_com = (function() {

    return {
        props: { // 属性
            text: {
                type: String,
                default: ''
            },
            type: {
                type: String,
                default: ''
            }
        },
        /**
         * render函数代替template写法
         * @param createElement
         */
        render(createElement) {
            return createElement(
                'h1',
                {
                    class: {
                        'h1-success': this.type === 'success',
                        'h1-danger': this.type === 'danger',
                        'h1-warning': this.type === 'warning'
                    },
                    domProps: {
                        innerText: this.text
                    },
                    on: {
                        click: this.clickEvent
                    }
                }
            )
        },
        methods: {
            clickEvent: function() {
                this.$emit('myEvent');
            }
        }
    };

}());