فهرست سرفصل‌های 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 — created (created)

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

created (created)

هوک created یعنی «کامپوننت ساخته شد». اینجا داده ها آماده اند، اما DOM هنوز نیست. می توانی data یا computed را بخوانی و تغییر بدهی.

created چه کاری انجام می دهد؟

این هوک بعد از مقداردهی کامپوننت اجرا می شود. بنابراین به data و computed دسترسی داریم. اما هنوز به عنصرهای صفحه دسترسی نداریم. چون DOM در mounted می آید.

نمونه منبع

در این نمونه، مقدار text داخل created تغییر می کند.

<script>
export default {
  data() {
    return {
      text: 'initial text'
    };
  },
  created() {
    this.text = 'The component is now created';
  }
};
<\/script>

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

چه زمانی از created استفاده کنیم؟

برای مقداردهی داده ها عالی است. همچنین برای فراخوانی سرویس ها مناسب است. اما برای کارهای DOM صبر کن.

گام های پیشنهادی

  1. داده ها را مقداردهی اولیه کن.
  2. در صورت نیاز، درخواست ها را ارسال کن.
  3. برای دسترسی DOM، به mounted برو.

نکته: اگر داده در beforeCreate تغییر نکرد، طبیعی است. آنجا هنوز ساخته نشده است. از created ویو برای مقداردهی استفاده کن.

هشدار: در created سراغ DOM نرو. عنصرها هنوز رندر نشده اند.

جمع بندی سریع

  • به data و computed دسترسی داریم.
  • DOM هنوز در دسترس نیست.
  • برای مقداردهی اولیه عالی است.
  • کارهای DOM را به mounted موکول کن.

پیوندهای داخلی: beforeCreate، هوک های چرخه عمر.

منابع: created (W3Schools)، فهرست Lifecycle Hooks.