arshivbastian / vue

a teamwork for vue
0 stars 0 forks source link

Event Bus #15

Open sdaliri opened 5 years ago

sdaliri commented 5 years ago

Event Bus

event-bus-vue-vw



Event Bus یک روش ارتباط بین component ها هست صرف نظر از این که component از نوع parent هست یا child

برای استفاده از Event Bus ابتدا یک فایل جدا با هر نامی که دوست دارید در root پروژه ایجاد میکنید و کد های زیر را داخل آن قرار میدهیم:



import Vue from 'vue';
export const EventBus = new Vue();

2018-12-26_12-59-39

به component که میخواید اطلاعات رو بفرستید رفته و کد زیر را قرار دهید به عکس و جایی که کد را درج میکنیم توجه کنید:

import { EventBus } from '@/evenBus.js';
EventBus.$emit('ChildToParent', e);

HTML

2018-12-26_13-31-44

JS

2018-12-26_13-28-46

به component که میخواهیم اطلاعات در آن درج شود رفته و کد زیر را قرار می دهیم



import {EventBus } from '@/evenBus.js';
EventBus.$on('ChildToParent', clickCount => {
    container += clickCount + ",";

   });



2018-12-26_13-40-14

برای اطلاعت بیشتر به سایت زیر مراجعه کنید: https://alligator.io/vuejs/global-event-bus/