1.0.0 • Published 7 years ago

vue-easy-event v1.0.0

Weekly downloads
2
License
ISC
Repository
github
Last release
7 years ago

Simple event bus for vue.js/简单的vue event bus

Installation/安装

npm i vue-easy-event

API

Eon

监听事件,传入事件名称(event)和句柄(handle)

    // @event - string
    // @handle - function
    this.Eon(event,handle);

Eonce

监听一次

    // @event - string
    // @handle - function
    this.Eonce(event,handle);

Eoff

取消监听,传入事件名称和句柄

    // @event - string
    // @handle - function
    this.Eoff(event,handle);

Etrigger

触发事件,传入事件名称,需要传递参数时使用data

    // @event - string
    // @data - object
    this.Etrigger(event,data);

匿名函数可以监听,但是无法取消监听。

Usage

//webpack
import Vue from 'vue';
import EventBus from 'vue-easy-event';
Vue.use(EventBus);

or

<script src="../node_modules/vue-easy-event/src/vue-easy-event.js"></script>
Vue.component('child', {
    template: '#child',
    data: function () {
        return {
            msg: 1
        };
    },
    methods: {
        add: function () {
            this.Etrigger('add', this.msg);
        }
    }
});
var vm = new Vue({
    el: '#app',
    data: {
        msg: 1
    },
    methods: {
        add: function (count) {
            this.msg += count || 1;
        },
        startListen() {
            this.Eon('add', this.add);
        },
        cancelListen() {
            this.Eoff('add', this.add);
        },
        listenOnce() {
            this.Eonce('add', this.add);
        },
    }
});
var vm2 = new Vue({
    el: '#app2',
    data: {
        msg: 2
    },
    methods: {
        add: function (count) {
            this.Etrigger('add', this.msg);
        }
    }
});

evet bus 虽然方便,但是仅仅适合非常小型简单的项目,否则还请使用vuex