Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: api/options-rendering.md translation #42

Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 23 additions & 23 deletions src/api/options-rendering.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,35 +2,35 @@

## template {#template}

A string template for the component.
কম্পোনেন্টের জন্য একটি স্ট্রিং টেমপ্লেট.

- **Type**
- **প্রকার**

```ts
interface ComponentOptions {
template?: string
}
```

- **Details**
- **বিস্তারিত**

A template provided via the `template` option will be compiled on-the-fly at runtime. It is only supported when using a build of Vue that includes the template compiler. The template compiler is **NOT** included in Vue builds that have the word `runtime` in their names, e.g. `vue.runtime.esm-bundler.js`. Consult the [dist file guide](https://github.com/vuejs/core/tree/main/packages/vue#which-dist-file-to-use) for more details about the different builds.
`template` অপশনের মাধ্যমে প্রদত্ত একটি টেমপ্লেট রানটাইমে সাথে সাথে কম্পাইল করা হবে। টেমপ্লেট কম্পাইলার অন্তর্ভুক্ত Vue-এর একটি বিল্ড ব্যবহার করার সময় এটি শুধুমাত্র সমর্থিত। টেমপ্লেট কম্পাইলার **NOT** Vue বিল্ডে অন্তর্ভুক্ত যেগুলির নামে `runtime` শব্দ আছে, যেমন `vue.runtime.esm-bundler.js`। বিভিন্ন বিল্ড সম্পর্কে আরও বিস্তারিত জানার জন্য [dist file guide](https://github.com/vuejs/core/tree/main/packages/vue#which-dist-file-to-use) দেখুন।

If the string starts with `#` it will be used as a `querySelector` and use the selected element's `innerHTML` as the template string. This allows the source template to be authored using native `<template>` elements.
যদি স্ট্রিংটি `#` দিয়ে শুরু হয় তবে এটি একটি `querySelector` হিসেবে ব্যবহার করা হবে এবং সিলেক্টেড ইলিমেন্টের `innerHTML` টেমপ্লেট স্ট্রিং হিসেবে ব্যবহার করা হবে। এটি সোর্স টেমপ্লেটটিকে নেটিভ `<template>` ইলিমেন্ট ব্যবহার করে লেখার অনুমতি দেয়।

If the `render` option is also present in the same component, `template` will be ignored.
যদি একই কম্পোনেন্টে `render` অপশনটিও উপস্থিত থাকে, তাহলে `template` ইগনোর করা হবে।

If the root component of your application doesn't have a `template` or `render` option specified, Vue will try to use the `innerHTML` of the mounted element as the template instead.
আপনার অ্যাপ্লিকেশনের রুট কম্পোনেন্টে একটি `template` বা `render` অপশন নির্দিষ্ট না থাকলে, Vue পরিবর্তে টেমপ্লেট হিসেবে মাউন্ট করা কম্পোনেন্টের `innerHTML` ব্যবহার করার চেষ্টা করবে।

:::warning Security Note
Only use template sources that you can trust. Do not use user-provided content as your template. See [Security Guide](/guide/best-practices/security#rule-no-1-never-use-non-trusted-templates) for more details.
:::warning সিকিউরিটি নোট
শুধুমাত্র টেমপ্লেট সোর্স ব্যবহার করুন যা আপনি বিশ্বাস করতে পারেন। আপনার টেমপ্লেট হিসাবে ব্যবহারকারী-প্রদত্ত কন্টেন্ট ব্যবহার করবেন না। আরও বিস্তারিত জানার জন্য [Security Guide](/guide/best-practices/security#rule-no-1-never-use-non-trusted-templates) দেখুন।
:::

## render {#render}

A function that programmatically returns the virtual DOM tree of the component.
একটি ফাংশন যা প্রোগ্রাম্যাটিকভাবে কম্পোনেন্টের ভার্চুয়াল DOM ট্রি রিটার্ন করে।

- **Type**
- **প্রকার**

```ts
interface ComponentOptions {
Expand All @@ -51,21 +51,21 @@ A function that programmatically returns the virtual DOM tree of the component.
type VNodeArrayChildren = (VNodeArrayChildren | VNodeChildAtom)[]
```

- **Details**
- **বিস্তারিত**

`render` is an alternative to string templates that allows you to leverage the full programmatic power of JavaScript to declare the render output of the component.
`render` হল স্ট্রিং টেমপ্লেটগুলির একটি বিকল্প যা আপনাকে কম্পোনেন্টের রেন্ডার আউটপুট ডিকলার করতে জাভাস্ক্রিপ্টের সম্পূর্ণ প্রোগ্রাম্যাটিক শক্তির সুবিধা নিতে দেয়।

Pre-compiled templates, for example those in Single-File Components, are compiled into the `render` option at build time. If both `render` and `template` are present in a component, `render` will take higher priority.
প্রি-কম্পাইল করা টেমপ্লেট, যেমন সিঙ্গেল-ফাইল কম্পোনেন্টে, বিল্ড টাইমে `render` অপশনে কম্পাইল করা হয়। যদি একটি কম্পোনেন্টে `render` এবং `template` উভয়ই উপস্থিত থাকে, তাহলে `render` অধিক অগ্রাধিকার নেবে।

- **See also**
- **আরো দেখুন**
- [Rendering Mechanism](/guide/extras/rendering-mechanism)
- [Render Functions](/guide/extras/render-function)

## compilerOptions {#compileroptions}

Configure runtime compiler options for the component's template.
কম্পোনেন্টের টেমপ্লেটের জন্য রানটাইম কম্পাইলার অপশন কনফিগার করুন।

- **Type**
- **প্রকার**

```ts
interface ComponentOptions {
Expand All @@ -78,19 +78,19 @@ Configure runtime compiler options for the component's template.
}
```

- **Details**
- **বিস্তারিত**

This config option is only respected when using the full build (i.e. the standalone `vue.js` that can compile templates in the browser). It supports the same options as the app-level [app.config.compilerOptions](/api/application#app-config-compileroptions), and has higher priority for the current component.
এই কনফিগার অপশনটি শুধুমাত্র সম্পূর্ণ বিল্ড ব্যবহার করার সময় রেসপেক্টেড করা হয় (অর্থাৎ স্বতন্ত্র `vue.js` যা ব্রাউজারে টেমপ্লেট কম্পাইল করতে পারে)। এটি অ্যাপ-লেভেল [app.config.compilerOptions](/api/application#app-config-compileroptions) এর মতো একই অপশনগুলিকে সমর্থন করে এবং বর্তমান কম্পোনেন্টের জন্য অধিক অগ্রাধিকার রয়েছে৷

- **See also** [app.config.compilerOptions](/api/application#app-config-compileroptions)
- **আরো দেখুন** [app.config.compilerOptions](/api/application#app-config-compileroptions)

## slots<sup class="vt-badge ts"/> {#slots}

An option to assist with type inference when using slots programmatically in render functions. Only supported in 3.3+.
রেন্ডার ফাংশনে প্রোগ্রাম্যাটিকভাবে স্লট ব্যবহার করার সময় টাইপ ইনফারেন্সে সহায়তা করার একটি অপশন। শুধুমাত্র 3.3+ এ সমর্থিত।

- **Details**
- **বিস্তারিত**

This option's runtime value is not used. The actual types should be declared via type casting using the `SlotsType` type helper:
এই অপশনের রানটাইম ভ্যালু ব্যবহার করা হয় না। প্রকৃত টাইপগুলি `SlotsType` টাইপ হেল্পার ব্যবহার করে টাইপ কাস্টিংয়ের মাধ্যমে ডিকলার করা উচিত:

```ts
import { SlotsType } from 'vue'
Expand Down