فهرست سرفصل‌های 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 — گزینه های نمونه (Instance Options)

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

گزینه های نمونه (Instance Options)

اینجا با «گزینه های نمونه» در ویو آشنا می شویم. «گزینه» یعنی تنظیماتی که هنگام ساخت نمونه با Options API می دهیم. مثل برنامه ریزی برای یک پروژه مدرسه است.

تعریف ساده گزینه ها

data: محل متغیرها و مقدار اولیه آن ها.

methods: محل توابعی که می نویسیم.

computed: داده های محاسبه ای؛ مثل تابع بدون ورودی با خروجی وابسته.

watch: ناظر تغییرات؛ با تغییر یک داده هم نام اجرا می شود.

props: ویژگی های ورودی یک کامپوننت از والد.

emits: رویدادهای سفارشی که کامپوننت به والد می فرستد.

expose: تعیین می کند چه چیزهایی عمومی بماند؛ بقیه خصوصی اند.

گام های عملی سریع

  1. گزینه های لازم را مشخص کن.
  2. نام گذاری کوتاه و واضح انجام بده.
  3. وابستگی ها را ساده و کم نگه دار.

نکته: برای محاسبات تکراری، از computed استفاده کن؛ سبک تر است.

هشدار: در watch کارهای سنگین نکن؛ باعث کندی می شود.

جمع بندی سریع

  • data برای داده خام است.
  • methods کارهای عملی را انجام می دهد.
  • computed نتیجه وابسته را برمی گرداند.
  • watch تغییرات داده را دنبال می کند.
  • props، emits، expose مخصوص ارتباط و دسترسی اند.

ادامه موضوع ها: صفحه v-text را ببین. همچنین به گزینه های نمونه برگرد برای مرور.