Skip to content

Commit 40e83a9

Browse files
AdnanBabakandebs-obrien
AdnanBabakan
and
debs-obrien
authored
Persian i18n added and translated (nuxt#608)
* i18n added and translated * Algolia search and code blocks fixed in rtl theme * Components glossary -> fetch translated * Readme updated * Minor change * head, key, layout and loading translated * Nuxt config updated * Components glossary translation completed * Persian lang commented in i18n nuxt config Co-authored-by: Debbie O'Brien <[email protected]>
1 parent 0b2647a commit 40e83a9

15 files changed

+897
-0
lines changed

‎README.md

+6
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,12 @@ The markdown files are stored in the content folder.
2929
- You can then start translating your files.
3030
- Once finished push your changes and then create a pull request.
3131

32+
## Contribute to Nuxtjs.org Persian translation
33+
34+
If you are interested in contributing to the Persian translation of Nuxtjs.org please follow the issue below for further information on how the work is going on:
35+
36+
[https://github.com/nuxt/nuxtjs.org/issues/555](https://github.com/nuxt/nuxtjs.org/issues/555)
37+
3238
## Development
3339

3440
Start the dev server on [http://localhost:3000](http://localhost:3000)

‎assets/css/main.scss

+1
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
11
@import 'content';
2+
@import 'rtl';

‎assets/css/rtl.scss

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
// Algolia search
2+
.algolia-wrapper {
3+
svg:first-child {
4+
margin-right: 0.75rem !important;
5+
margin-left: 0 !important;
6+
}
7+
8+
input#algolia-main {
9+
padding-right: 2.5em !important;
10+
padding-left: 0 !important;;
11+
direction: rtl;
12+
}
13+
14+
button[aria-label="Clear input"] {
15+
right: unset !important;
16+
left: 0 !important;
17+
}
18+
}
19+
20+
// Code block switched to ltr
21+
.nuxt-content pre {
22+
direction: ltr !important;
23+
}

‎content/fa/guides/components-glossary/pages-fetch.md

+77
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
---
2+
title: 'متد fetch'
3+
description: متد `fetch` برای بارگزاری اطلاعات در store قبل از رندر شدن صفحه استفاده می شود. عملکردی مشابه `asyncData` دارد با تفاوت اینکه داده‌های کامپوننت را تنظیم نمی‌کند.
4+
menu: متد fetch
5+
category: components-glossary
6+
---
7+
8+
## Nuxt >= 2.12
9+
10+
نسخه `2.12` Nuxt.js هوک جدیدی به نام `fetch` را **در تمامی کامپوننت‌های Vue** در اختیار شما قرار می‌دهد.
11+
12+
<base-alert>
13+
14+
متد `fetch(context)` منسوح شده است، به جای آن میتوانید از یک [میان افزار](/guides/components-glossary/pages-middleware#anonymous-middleware) در صفحات خود استفاده کنید: `middleware(context)`
15+
16+
</base-alert>
17+
18+
### چه موقع از fetch استفاده کنیم؟
19+
20+
هرگاه بخواهید داده‌هایی **غیرهمزمان** (asynchronous) متد `fetch` در سمت سرور هنگامی که مسیر در حال رندر و یا در سمت سرور وقتی که کاربر در حال هدایت است فراخوانی می‌شود.
21+
22+
It exposes `$fetchState` at the component level:
23+
این متد از `$fetchState‍` استفاده می کند:
24+
25+
- `$fetchState.pending`: از نوع `Boolean`, می‌تواند برای نمایش یک placeholder استفاده شود وقتی که fecth در سمت کاربر در حال استفاده است
26+
- `$fetchState.error`: از نوع `null` یا `Error`, می‌تواند برای نمایش پیام خطا استفاده شود
27+
- `$fetchState.timestamp`: از نوع `Integer`, یک تایم‌استمپ از آخرین fetch است. می‌تواند برای استفاده در کش (cache) با استفاده از `keep-alive` مفید باشد
28+
29+
اگر می‌خواهید هوک `fetch` را در قالب خود فراخوانی کنید:
30+
31+
```html
32+
<button @click="$fetch">Refresh</button>
33+
```
34+
35+
یا با استفاده از متد کامپوننت:
36+
37+
```javascript
38+
// from component methods in script section
39+
export default {
40+
methods: {
41+
refresh() {
42+
this.$fetch()
43+
}
44+
}
45+
}
46+
```
47+
48+
می‌توانید به [context](/guides/internals-glossary/context) فریم‌ورک Nuxt داخل هوک fetch با استفاده از `this.$nuxt.context` دسترسی داشته باشید.
49+
50+
### تنظیمات
51+
52+
- `fetchOnServer`: از نوع `Boolean` یا `Function` (به صورت پیشفرض `true`)، تنظیم جهت فراخوانی `fetch()` زمانی که صفحات در سمت سرور رندر می‌شوند
53+
- `fetchDelay`: از نوع `Integer` (به صورت پیشفرض `۲۰۰`)، جهت تنظیم حداقل زمان اجرا به میلی ثانیه
54+
55+
<div class="Alert Alert--green">
56+
57+
زمانی که `fetchOnServer` مقدار `false` (یا تابعی که نتیجه آن مقدار `false` باشد) داشته باشد، تابع `fetch` تنها در سمت کاربر فراخوانی می‌شود و `$fetchState.pending` مقدار `true` را زمانی که صفحه در حال رندر در سمت سرور است را برخواهد گرداند.
58+
59+
</div>
60+
61+
```html
62+
<script>
63+
export default {
64+
data() {
65+
return {
66+
posts: []
67+
}
68+
},
69+
async fetch() {
70+
this.posts = await this.$http.$get(
71+
'https://jsonplaceholder.typicode.com/posts'
72+
)
73+
},
74+
fetchOnServer: false
75+
}
76+
</script>
77+
```

‎content/fa/guides/components-glossary/pages-head.md

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
---
2+
title: 'متد head'
3+
description: Nuxt.js از vue-meta برای بروزرسانی هدر و مولفه‌های HTML در اپلیکیشن شما استفاده می‌کند.
4+
menu: متد Head
5+
category: components-glossary
6+
---
7+
8+
> Nuxt.js از [vue-meta](https://github.com/nuxt/vue-meta) برای بروزرسانی هدر و مولفه‌های HTML در اپلیکیشن شما استفاده می‌کند.
9+
10+
- **نوع:** `Object` یا `Function`
11+
12+
از متد `head` برای تنظیم تگ‌های Head در صفحه کنونی استفاده کنید.
13+
14+
```html
15+
<template>
16+
<h1>{{ title }}</h1>
17+
</template>
18+
19+
<script>
20+
export default {
21+
data() {
22+
return {
23+
title: 'Hello World!'
24+
}
25+
},
26+
head() {
27+
return {
28+
title: this.title,
29+
meta: [
30+
// hid is used as unique identifier. Do not use `vmid` for it as it will not work
31+
{
32+
hid: 'description',
33+
name: 'description',
34+
content: 'My custom description'
35+
}
36+
]
37+
}
38+
}
39+
}
40+
</script>
41+
```

‎content/fa/guides/components-glossary/pages-key.md

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
---
2+
title: 'ویژگی key'
3+
description: جهت تنظیم ویژگی `key` در کامپوننت داخلی `<router-view>`
4+
menu: ویژگی Key
5+
category: components-glossary
6+
---
7+
8+
> جهت تنظیم ویژگی `key` در کامپوننت داخلی `<router-view>`
9+
10+
- **نوع:** `String` یا `Function`
11+
12+
ویژگی `key` در کامپوننت `<router-view>` جهت انتقال در داخل یک صفحه داینامیک و دیگر مسیرها استفاده می‌شود. `key`های متفاوت باعث رندر شدن کامپوننت صفحات می‌شوند.
13+
14+
راه‌های زیادی برای تنظیم ویژگی `key` وجود دارد. برای اطلاعات بیشتر به ویژگی `nuxtChildKey` در صفحه [کامپوننت Nuxt](/guides/features/nuxt-components) مراجعه کنید.
15+
16+
```js
17+
export default {
18+
key(route) {
19+
return route.fullPath
20+
}
21+
}
22+
```

‎content/fa/guides/components-glossary/pages-layout.md

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
---
2+
title: 'ویژگی layout'
3+
description: هر فایل (در ریشه) پوشه `layouts` یک ساختار سفارشی قابل دسترس توسط ویژگی layout در کامپوننت صفحات ایجاد می‌کند.
4+
menu: ویژگی Layout
5+
category: components-glossary
6+
---
7+
8+
> هر فایل (در ریشه) پوشه `layouts` یک ساختار سفارشی قابل دسترس توسط ویژگی layout در کامپوننت صفحات ایجاد می‌کند.
9+
10+
- **نوع:** `String` یا `Function` (به صورت پیشفرض `'default'`)
11+
12+
برای تنظیم ساختار (layout) مورد استفاده در صفحه از کلیدواژه `layout` در کامپوننت صفحه استفاده کنید:
13+
14+
```js
15+
export default {
16+
layout: 'blog',
17+
// OR
18+
layout(context) {
19+
return 'blog'
20+
}
21+
}
22+
```

‎content/fa/guides/components-glossary/pages-loading.md

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
---
2+
title: 'ویژگی loading'
3+
description: ویژگی `loading` این امکان را می‌دهد تا نوار پیشرفت بارگزاری پیشفرض را در یک صفحه بخصوص غیرفعال کنید.
4+
menu: ویژگی Loading
5+
category: components-glossary
6+
---
7+
8+
> ویژگی `loading` این امکان را می‌دهد تا نوار پیشرفت بارگزاری پیشفرض را در یک صفحه بخصوص غیرفعال کنید.
9+
10+
- **Type:** `Boolean` (default: `true`)
11+
12+
Nuxt.js به صورت پیشفرض از کامپوننت خود برای نمایش نوار پیشرفت هنگام انتقال بین مسیرها استفاده می کند.
13+
14+
شما می‌توانید این نوار پیشرفت را به صورت کلی غیرفعال و یا از طریق [تنظیمات بارگیری](/guides/configuration-glossary/configuration-loading) سفارشی سازی کنید. همچنین می‌توانید این نوار پیشرفت را برای یک صفحه بخصوص از طریق تنظیم ویژگی `loading` به مقدار `false` غیرفعال کنید.
15+
16+
```html
17+
<template>
18+
<h1>My page</h1>
19+
</template>
20+
21+
<script>
22+
export default {
23+
loading: false
24+
}
25+
</script>
26+
```

‎content/fa/guides/components-glossary/pages-middleware.md

+57
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
---
2+
title: 'ویژگی میان‌افزار'
3+
description: جهت تنظیم میان افزار برای یک صفحه بخصوص در اپلیکیشن.
4+
menu: ویژگی میان‌افزار
5+
category: components-glossary
6+
---
7+
8+
- **نوع:** `String` یا `Array` یا `Function`
9+
- **آیتم‌ها**: `String` یا `Function`
10+
11+
جهت تنظیم میان افزار برای یک صفحه بخصوص در اپلیکیشن.
12+
13+
## میان‌افزارهای با نام
14+
15+
می‌توانید با ایجاد یک فایل داخل پوشه `middleware/` یک میان‌افزار با نام ایجاد کنید. نام این فایل به عنوان نام میان‌افزار در نظر گرفته خواهد شد.
16+
17+
```js{[middleware/authenticated.js]}
18+
export default function ({ store, redirect }) {
19+
// If the user is not authenticated
20+
if (!store.state.authenticated) {
21+
return redirect('/login')
22+
}
23+
}
24+
```
25+
26+
```html{}[pages/secret.vue]
27+
<template>
28+
<h1>Secret page</h1>
29+
</template>
30+
31+
<script>
32+
export default {
33+
middleware: 'authenticated'
34+
}
35+
</script>
36+
```
37+
38+
## میان‌افزارهای بی‌نام
39+
40+
در صورتی که می‌خواهید از یک میان‌افزار فقط برای یک صفحه بخصوص استفاده کنید، می‌توانید این میان‌افزار را به عنوان یک تابع و یا آرایه‌ای از توابع تعریف و مستقیما استفاده کنید:
41+
42+
```html{[pages/secret.vue]}
43+
<template>
44+
<h1>Secret page</h1>
45+
</template>
46+
47+
<script>
48+
export default {
49+
middleware({ store, redirect }) {
50+
// If the user is not authenticated
51+
if (!store.state.authenticated) {
52+
return redirect('/login')
53+
}
54+
}
55+
}
56+
</script>
57+
```

‎content/fa/guides/components-glossary/pages-scrolltotop.md

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
---
2+
title: 'ویژگی scrollToTop'
3+
description: ویژگی `scrollToTop` به شما این امکان را می‌دهد تا به Nuxt.js دستور دهید تا قبل از رندر کردن صفحه به بالای صفحه اسکرول کند.
4+
menu: ویژگی scrollToTop
5+
category: components-glossary
6+
---
7+
8+
> ویژگی `scrollToTop` به شما این امکان را می‌دهد تا به Nuxt.js دستور دهید تا قبل از رندر کردن صفحه به بالای صفحه اسکرول کند.
9+
10+
- **نوع:**: `Boolean` (به صورت پیشفرض `false`)
11+
12+
به صورت پیشفرض Nuxt.js وقتی به صفحه دیگری انتقال پیدا می‌کنید شما را به بالای صفحه انتقال (اسکرول) می‌دهد. اما در مورد مسیرهای فرزند Nuxt.js موقعیت اسکرول را حفظ می‌کند. اگر می‌خواهید به Nuxt.js بگویید تا شما را به بالای صفحه منتقل کند، مقدار ویژگی `scrollToTop` را برابر با `true` قرار دهید:
13+
14+
```html
15+
<template>
16+
<h1>My child component</h1>
17+
</template>
18+
19+
<script>
20+
export default {
21+
scrollToTop: true
22+
}
23+
</script>
24+
```
25+
26+
متقابلا می‌توانید به صورت دستی مقدار ویژگی `scrollToTop` را در مسیر‌های اصلی (مادر) برابر با `false` قرار دهید.
27+
28+
If you want to overwrite the default scroll behavior of Nuxt.js, take a look at the
29+
اگر می‌خواهید رفتار پیشفرض Nuxt.js در مورد اسکرول کردن را تغییر دهید به [تنظیمات رفتار اسکرول](/guides/configuration-glossary/configuration-router#scrollbehavior) مراجعه کنید.

0 commit comments

Comments
 (0)