المؤلف:

إنشاء:2026-06-12آخر تحديث:2026-06-12

استخدم هذه الصفحة والموفر AI الذي تريدهChatGPT Claude DeepSeek Google AI mode Gemini Perplexity Mistral Grok

استخدم مساعدك المفضل للملخص واستخدم هذه الصفحة والموفر AI الذي تريده

تاريخ الإصدارات

"إصدار ميزة المحتوى الديناميكي"
v9.0.0١٢‏/٦‏/٢٠٢٦

تمت ترجمة محتوى هذه الصفحة باستخدام الذكاء الاصطناعي.

اعرض آخر نسخة المحتوى الأصلي باللغة الإنكليزية

تعديل هذه الوثيقة

إذا كان لديك فكرة لتحسين هذه الوثيقة، فلا تتردد في المساهمة من خلال تقديم طلب سحب على GitHub.

رابط GitHub للتوثيق

نسخ

نسخ الـ Markdown من المستند إلى الحافظة

السجلات الديناميكية

Name: Intlayer
Author: Intlayer

السجل الديناميكي (dynamic record) هو ملف محتوى لا يتم تحديد هويته بواسطة فهرس تسلسلي أو متغير مسمى، بل بواسطة مجموعة عشوائية من أزواج المفاتيح والقيم المعلنة في حقل meta. يستخدم Intlayer هذه الحقول كمحدد في وقت التشغيل، مما يتيح معالجة سجلات CMS، أو نسخ محددة للمستخدم، أو أي محتوى لا تُعرف مفاتيحه في وقت البناء.

الإعلان عن السجلات الديناميكية

product-copy.abc.content.ts

نسخ الكود

نسخ الكود إلى الحافظة

import { t, type Dictionary } from "intlayer";

const dictionary = {
  key: "product-copy",
  meta: {
    id: "prod_abc",
    userId: "user_123",
  },
  content: {
    name: t({ en: "Widget Pro", fr: "Widget Pro" }),
    description: t({ en: "The best widget.", fr: "Le meilleur widget." }),
  },
} satisfies Dictionary;

export default dictionary;

product-copy.abcd.content.ts

نسخ الكود

نسخ الكود إلى الحافظة

import { t, type Dictionary } from "intlayer";

const dictionary = {
  key: "product-copy",
  meta: {
    id: "prod_abcd",
    userId: "user_123",
  },
  content: {
    name: t({ en: "Widget Lite", fr: "Widget Lite" }),
    description: t({ en: "A lighter option.", fr: "Une option plus légère." }),
  },
} satisfies Dictionary;

export default dictionary;

استهلاك السجلات الديناميكية

جميع حقول meta مطلوبة في المحدد. يؤدي حذف أي حقل إلى إرجاع null ويعد خطأ في TypeScript.

ProductCopy.tsx

نسخ الكود

نسخ الكود إلى الحافظة

import { useIntlayer } from "react-intlayer";

export const ProductCopy = ({
  productId,
  userId,
}: {
  productId: string;
  userId: string;
}) => {
  const content = useIntlayer("product-copy", { id: productId, userId });
  // يضمن TypeScript توفير كل من `id` و `userId`.

  if (!content) return null;

  return <p>{content.description}</p>;
};

ProductCopy.tsx

نسخ الكود

نسخ الكود إلى الحافظة

import { useIntlayer } from "next-intlayer";

export const ProductCopy = ({
  productId,
  userId,
}: {
  productId: string;
  userId: string;
}) => {
  const content = useIntlayer("product-copy", { id: productId, userId });
  // يضمن TypeScript توفير كل من `id` و `userId`.

  if (!content) return null;

  return <p>{content.description}</p>;
};

ProductCopy.vue

نسخ الكود

نسخ الكود إلى الحافظة

<script setup>
import { useIntlayer } from "vue-intlayer";

const props = defineProps({
  productId: String,
  userId: String,
});

const content = useIntlayer("product-copy", { id: props.productId, userId: props.userId });
</script>

<template>
  <p v-if="content">{{ content.description }}</p>
</template>

ProductCopy.svelte

نسخ الكود

نسخ الكود إلى الحافظة

<script lang="ts">
import { useIntlayer } from "svelte-intlayer";

export let productId: string;
export let userId: string;

const content = useIntlayer("product-copy", { id: productId, userId });
</script>

{#if $content}
  <p>{$content.description}</p>
{/if}

ProductCopy.tsx

نسخ الكود

نسخ الكود إلى الحافظة

import { useIntlayer } from "preact-intlayer";

export const ProductCopy = ({
  productId,
  userId,
}: {
  productId: string;
  userId: string;
}) => {
  const content = useIntlayer("product-copy", { id: productId, userId });
  // يضمن TypeScript توفير كل من `id` و `userId`.

  if (!content) return null;

  return <p>{content.description}</p>;
};

ProductCopy.tsx

نسخ الكود

نسخ الكود إلى الحافظة

import { useIntlayer } from "solid-intlayer";

export const ProductCopy = (props: {
  productId: string;
  userId: string;
}) => {
  const content = useIntlayer("product-copy", { id: props.productId, userId: props.userId });
  // يضمن TypeScript توفير كل من `id` و `userId`.

  return (
    <>
      {content() && <p>{content().description}</p>}
    </>
  );
};

product-copy.component.ts

نسخ الكود

نسخ الكود إلى الحافظة

import { Component, Input, OnInit } from "@angular/core";
import { useIntlayer } from "angular-intlayer";

@Component({
  selector: "app-product-copy",
  template: `
    @if (content()) {
      <p>{{ content().description }}</p>
    }
  `,
})
export class ProductCopyComponent implements OnInit {
  @Input() productId!: string;
  @Input() userId!: string;

  content: any;

  ngOnInit() {
    this.content = useIntlayer("product-copy", { id: this.productId, userId: this.userId });
  }
}

product-copy.js

نسخ الكود

نسخ الكود إلى الحافظة

import { useIntlayer } from "vanilla-intlayer";const content = useIntlayer("product-copy", {  id: "prod_abcd",  userId: "user_123"});if (content) {  document.body.innerHTML = `<p>${content.description}</p>`;}

مع تحديد لغة صريحة

tsx

نسخ الكود

نسخ الكود إلى الحافظة

const content = useIntlayer("product-copy", {  id: "prod_abc",  userId: "user_123",  locale: "fr",});

حقل meta مفقود — خطأ وقت الترجمة

نسخ الكود

نسخ الكود إلى الحافظة

// خطأ في النوع: `userId` مفقودconst content = useIntlayer("product-copy", { id: "prod_abc" });

وضع التحميل

عادة ما يتم تحميل السجلات الديناميكية بشكل كسول. قم بتعيين importMode في القاموس للتحكم في ذلك:

نسخ الكود

نسخ الكود إلى الحافظة

const dictionary = {
  key: "product-copy",
  importMode: "fetch", // أو "dynamic"
  meta: { id: "prod_abc", userId: "user_123" },
  content: { … },
} satisfies Dictionary;

export default dictionary;

انظر تحسين الحزمة لمعرفة التفاصيل حول الأوضاع static و dynamic و fetch.

حالات الاستخدام الشائعة

نسخة تسويقية لكل منتج تتم إدارتها في نظام إدارة المحتوى (CMS)
محتوى خاص بالمستخدم أو خاص بالحساب
أي محتوى يتم تعيينه بواسطة معرف تشغيل غير شفاف

المتغيرات ملف لكل لغة