فهرست سرفصل‌های Vue
خانه (HOME) معرفی (Intro) دایرکتیوها (Directives) v-bind (v-bind) v-if (v-if) v-show (v-show) v-for (v-for) رویدادها (Events) v-on (v-on) متدها (Methods) تغییردهنده های رویداد (Event Modifiers) فرم ها (Forms) v-model (v-model) بایندینگ CSS (CSS Binding) ویژگی های محاسبه شده (Computed Properties) واچرها (Watchers) قالب ها (Templates) چرا، چگونه و راه اندازی (Why, How and Setup) اولین صفحه SFC (First SFC Page) کامپوننت ها (Components) پراپس (Props) کامپوننت های v-for (v-for Components) $emit() ($emit()) ویژگی های عبوری (Fallthrough) (Fallthrough Attributes) استایل Scoped (Scoped Styling) کامپوننت های محلی (Local Components) اسلات ها (Slots) v-slot (v-slot) اسلات های Scoped (Scoped Slots) کامپوننت های پویا (Dynamic Components) Teleport (Teleport) درخواست HTTP (HTTP Request) رفرنس های تمپلیت (Template Refs) هوک های چرخه عمر (Lifecycle Hooks) Provide/Inject (Provide/Inject) مسیریابی (Routing) ورودی های فرم (Form Inputs) انیمیشن ها (Animations) انیمیشن با v-for (Animations with v-for) بیلد (Build) Composition API (Composition API) ویژگی های توکار (Built-in Attributes) ویژگی 'is' ('is' Attribute) ویژگی 'key' ('key' Attribute) ویژگی 'ref' ('ref' Attribute) کامپوننت های توکار (Built-in Components) <KeepAlive> (<KeepAlive>) <Teleport> (<Teleport>) <Transition> (<Transition>) <TransitionGroup> (<TransitionGroup>) المان های توکار (Built-in Elements) <component> (<component>) <slot> (<slot>) <template> (<template>) نمونه کامپوننت (Component Instance) $attrs ($attrs) $data ($data) $el ($el) $parent ($parent) $props ($props) $refs ($refs) $root ($root) $slots ($slots) $emit() ($emit()) $forceUpdate() ($forceUpdate()) $nextTick() ($nextTick()) $watch() ($watch()) دایرکتیوها (Directives) v-bind (v-bind) v-cloak (v-cloak) v-for (v-for) v-html (v-html) v-if (v-if) v-else-if (v-else-if) v-else (v-else) v-memo (v-memo) v-model (v-model) v-on (v-on) v-once (v-once) v-pre (v-pre) v-show (v-show) v-slot (v-slot) v-text (v-text) گزینه های نمونه (Instance Options) داده ها (data) متدها (methods) محاسبه شده ها (computed) watch (watch) پراپس (props) emits (emits) expose (expose) هوک های چرخه عمر (Lifecycle Hooks) beforeCreate (beforeCreate) created (created) beforeMount (beforeMount) mounted (mounted) beforeUpdate (beforeUpdate) updated (updated) beforeUnmount (beforeUnmount) unmounted (unmounted) errorCaptured (errorCaptured) renderTracked (renderTracked) renderTriggered (renderTriggered) activated (activated) deactivated (deactivated) serverPrefetch (serverPrefetch) مثال ها (Examples) تمرین ها (Exercises) کوییز (Quiz) سیلابس (Syllabus) برنامه مطالعه (Study Plan) سرور (Server) گواهینامه (Certificate)
نتیجه‌ای برای جستجو یافت نشد.
Vue

Vue — emits (emits)

آخرین بروزرسانی: 1404/08/21

emits (emits)

emits در ویو یعنی «رویداد سفارشی» که کامپوننت فرزند به والد می فرستد. مثل زنگ مدرسه که خبر می دهد کلاس تمام شد.

تعریف و کاربرد emits

گزینه emits لیست رویدادهای سفارشیِ خارج شونده را مشخص می کند. لازم نیست حتماً تعریف شود؛ اما نوشتن آن توصیه می شود تا دیگران بدانند کامپوننت چه رویدادهایی می فرستد.

حالت آرایه فقط نام رویدادها را می نویسد. حالت شیء می تواند برای هر رویداد «اعتبارسنج» بدهد؛ اگر اعتبارسنج ندارید، مقدارش می تواند null باشد.

نمونه ساده: تعریف و شلیک رویداد سفارشی

export default {
  emits: [
    'custom-event'
  ],
  methods: {
    notifyParent() {
      this.$emit('custom-event', 'Hello!');
    }
  }
};

مشاهده در ادیتور

گام های عملی کار با emits

  1. نام رویدادها را در emits اعلام کن.
  2. در متد، با $emit رویداد را شلیک کن.
  3. در والد، رویداد را با v-on یا @ گوش کن.

نکته: تعریف emits اجباری نیست؛ اما برای مستندسازی عالی است.

هشدار: هنگام استفاده از فلش فانکشن، به this دسترسی ندارید. برای متدها از توابع معمولی استفاده کن.

جمع بندی سریع

  • emits رویدادهای خروجی را معرفی می کند.
  • آرایه ساده است؛ شیء اعتبارسنج دارد.
  • $emit رویداد را اجرا می کند.
  • نوشتن emits مستندسازی تمیز می دهد.
  • از فلش فانکشن در متدها پرهیز کن.

لینک های داخلی: ایونت سفارشی ویو، props، watch.

منابع: مرجع emits، مرجع $emit()، Vue Props.