fix: ways-of-using-vue and composition-api-faq

vuejs-translations · Feb 23, 2024 · 2015f81 · 2015f81
1 parent d578f64
commit 2015f81
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 32 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -10,6 +10,7 @@
     "استایل",
     "استایلی",
     "استرینگ",
+    "استک",
     "اِستیت",
     "اسکرول",
     "اسکوپ",

diff --git a/src/guide/extras/composition-api-faq.md b/src/guide/extras/composition-api-faq.md
@@ -4,15 +4,15 @@ outline: deep
 
 # سوالات متداول در مورد Composition API {#composition-api-faq}
 
-:::tip
+:::tip نکته
 این سوالات متداول فرض بر آشنایی قبلی با Vue - به خصوص تجربه کار با Vue 2 با استفاده از Options API - را دارد.
 :::
 
 ## Composition API چیست؟ {#what-is-composition-api}
 
 <VueSchoolLink href="https://vueschool.io/lessons/introduction-to-the-vue-js-3-composition-api" title="Free Composition API Lesson"/>
 
-Composition API مجموعه‌ای از APIها است که به ما اجازه می‌دهد کامپوننت‌های Vue را با استفاده از توابع import شده به جای تعریف آپشن‌ها (option) بنویسیم. در واقع یک اصطلاح کلی برای پوشش APIهای زیر است:
+Composition API مجموعه‌ای از APIها است که به ما اجازه می‌دهد کامپوننت‌های Vue را با استفاده از import کردن توابع به جای تعریف آپشن‌ها بنویسیم. در واقع یک اصطلاح کلی برای پوشش APIهای زیر است:
 
 - [Reactivity API](/api/reactivity-core) مانند `ref()‎` و `reactive()‎` که به ما اجازه می‌دهد stateهای reactive، computed و watchers را به صورت مستقیم ایجاد کنیم.
 
@@ -55,13 +55,13 @@ onMounted(() => {
 
 مزیت اصلی Composition API این است که امکان استفاده مجدد clean (تمیز) و بهینه از logic (منطق) را به صورت [Composable functions](/guide/reusability/composables) فراهم می‌کند. این تمامی [محدودیت‌های mixin‌ها](/guide/reusability/composables#vs-mixins) را حل می‌کند که مکانیزم اصلی استفاده مجدد از logic در Options API است.
 
-قابلیت استفاده مجدد از logic در Composition API منجر به پروژه‌های community تحسین‌برانگیزی مانند [VueUse](https://vueuse.org/) شده است، که مجموعه‌ای رو به رشد از ابزارهای composable است. همچنین به عنوان مکانیزمی clean برای ادغام آسان سرویس‌ها یا کتابخانه‌های شخص ثالث دارای state در سیستم reactivity فریمورک Vue عمل می‌کند، برای مثال [immutable data](/guide/extras/reactivity-in-depth#immutable-data)، [state machines](/guide/extras/reactivity-in-depth#state-machines) و [RxJS](/guide/extras/reactivity-in-depth#rxjs).
+قابلیت استفاده مجدد از logic در Composition API منجر به پروژه‌های community تحسین‌برانگیزی مانند [VueUse](https://vueuse.org/) شده است، که مجموعه‌ای رو به رشد از ابزارهای composable است. همچنین به عنوان مکانیزمی تمیز برای ادغام آسان سرویس‌ها یا کتابخانه‌های شخص ثالث دارای state در سیستم reactivity فریمورک Vue عمل می‌کند، برای مثال [immutable data](/guide/extras/reactivity-in-depth#immutable-data) ، [state machines](/guide/extras/reactivity-in-depth#state-machines) و [RxJS](/guide/extras/reactivity-in-depth#rxjs).
 
 ### سازماندهی انعطاف‌پذیرتر کد {#more-flexible-code-organization}
 
-بسیاری از کاربران دوست دارند که به طور پیش‌فرض با Options API کد منسجمی بنویسیم: هر چیزی جای خود را بر اساس آپشن مخصوصی که زیر آن قرار دارد، پیدا می‌کند. با این حال، Options API محدودیت‌های جدی هنگامی که logic یک کامپوننت خاص از حد آستانه پیچیدگی مشخصی فراتر می‌رود، ایجاد می‌کند. این محدودیت به ویژه در کامپوننت‌هایی که نیاز به مدیریت **logical concerns (چندین موضوع منطقی)** دارند، برجسته است که ما شاهد آن در بسیاری از برنامه‌های تولید شده با Vue 2 بوده‌ایم.
+بسیاری از کاربران دوست دارند که به طور پیش‌فرض با Options API کد منسجمی بنویسیم: هر چیزی جای خود را بر اساس آپشن مخصوصی که زیر آن قرار دارد، پیدا می‌کند. با این حال، Options API محدودیت‌های جدی هنگامی که کد یک کامپوننت خاص از حد آستانه پیچیدگی مشخصی فراتر می‌رود، ایجاد می‌کند. این محدودیت به ویژه در کامپوننت‌هایی که نیاز به مدیریت **چندین موضوع منطقی (logical concerns)** دارند، برجسته است که ما شاهد آن در بسیاری از برنامه‌های تولید شده با Vue 2 بوده‌ایم.
 
-به عنوان مثال کامپوننت اکسپلورر پوشه‌ها از GUI Vue CLI را در نظر بگیرید: این کامپوننت مسئول موارد منطقی زیر است:
+به عنوان مثال کامپوننت اکسپلورر پوشه‌ها از GUI Vue CLI را در نظر بگیرید. این کامپوننت مسئول موارد منطقی زیر است:
 
 - پیگیری state پوشه جاری و نمایش محتوای آن
 - مدیریت ناوبری (navigation) پوشه (باز کردن، بستن، بازخوانی...)
@@ -70,17 +70,17 @@ onMounted(() => {
 - تاگل کردن روی نمایش پوشه‌های پنهان
 - مدیریت تغییرات دایرکتوری کاری جاری
 
-[نسخه اصلی](https://github.com/vuejs/vue-cli/blob/a09407dd5b9f18ace7501ddb603b95e31d6d93c0/packages/@vue/cli-ui/src/components/folder/FolderExplorer.vue#L198-L404) این کامپوننت با  Options API نوشته شده بود. اگر به هر خط کد یک رنگ بر اساس موضوع منطقی که در حال مدیریت آن است، اختصاص دهیم، به این صورت به نظر می‌رسد:
+[نسخه اصلی](https://github.com/vuejs/vue-cli/blob/a09407dd5b9f18ace7501ddb603b95e31d6d93c0/packages/@vue/cli-ui/src/components/folder/FolderExplorer.vue#L198-L404) این کامپوننت با Options API نوشته شده بود. اگر به هر خط کد یک رنگ بر اساس موضوع منطقی که در حال مدیریت آن است، اختصاص دهیم، به این صورت به نظر می‌رسد:
 
 <img alt="folder component before" src="./images/options-api.png" width="129" height="500" style="margin: 1.2em auto">
 
-توجه کنید که کد مربوط به یک موضوع منطقی یکسان مجبور به تقسیم شدن تحت آپشن‌های مختلف در قسمت‌های مختلف فایل است. در یک کامپوننت چند صد خطی، درک و ناوبری یک موضوع منطقی تکی نیازمند اسکرول مداوم بالا و پایین فایل است که آن را دشوارتر از آنچه باید باشد، می‌کند. علاوه بر این، اگر قصد استخراج یک موضوع منطقی به یک ابزار قابل استفاده مجدد داشته باشیم، پیدا کردن و استخراج قطعات مناسب کد از قسمت‌های مختلف فایل کار زیادی می‌طلبد.
+توجه کنید که کد مربوط به یک موضوع یکسان مجبور به تقسیم شدن تحت آپشن‌های مختلف در قسمت‌های مختلف فایل است. در یک کامپوننت چند صد خطی، درک و ناوبری یک موضوع منطقی تکی نیازمند اسکرول مداوم بالا و پایین فایل است که آن را دشوارتر از آنچه باید باشد، می‌کند. علاوه بر این، اگر قصد استخراج یک موضوع به یک ابزار قابل استفاده مجدد داشته باشیم، پیدا کردن و استخراج قطعات مناسب کد از قسمت‌های مختلف فایل کار زیادی می‌طلبد.
 
 اینجا همان کامپوننت، قبل و بعد از [بازنویسی به Composition API](https://gist.github.com/yyx990803/8854f8f6a97631576c14b63c8acd8f2e) است:
 
 ![folder component after](./images/composition-api-after.png)
 
-توجه کنید که اکنون کد مربوط به یک موضوع منطقی می‌تواند در کنار هم گروه‌بندی شود: دیگر نیازی نیست هنگام کار روی یک موضوع منطقی خاص، بین بلوک‌های آپشن‌های مختلف جابجا شویم. علاوه بر این، اکنون می‌توانیم گروهی از کد را با تلاش کمینه به یک فایل خارجی منتقل کنیم، چرا که دیگر نیازی به جابجایی کد برای استخراج آن‌ها نیست. این کاهش اصطکاک برای بازنویسی برای نگهداری طولانی مدت در کدبیس‌های بزرگ حیاتی است.
+توجه کنید که اکنون کد مربوط به یک موضوع می‌تواند در کنار هم گروه‌بندی شود: دیگر نیازی نیست هنگام کار روی یک موضوع خاص، بین بلوک‌های آپشن‌های مختلف جابجا شویم. علاوه بر این، اکنون می‌توانیم گروهی از کد را با تلاش کمتری به یک فایل خارجی منتقل کنیم، چرا که دیگر نیازی به جابجایی کد برای استخراج آن‌ها نیست. این کاهش اصطکاک بازنویسی، برای نگهداری طولانی مدت در کدبیس‌های بزرگ حیاتی است.
 
 ### Better Type Inference {#better-type-inference}
 
@@ -106,7 +106,7 @@ Options API اجازه می‌دهد بدون فکر کردن زیاد کد کا
 
 ### آیا Composition API همه موارد استفاده را پوشش می‌دهد؟ {#does-composition-api-cover-all-use-cases}
 
-بله، از نظر منطق دارای state. هنگام استفاده از Composition API، تنها چند گزینه ممکن است همچنان نیاز باشد: `props`، `emits`، `name`، و `inheritAttrs`.
+بله، از نظر stateful logic. هنگام استفاده از Composition API، تنها چند گزینه ممکن است همچنان نیاز باشد: `props`، `emits`، `name`، و `inheritAttrs`.
 
 :::tip نکته