Autor:

Data utworzenia:2026-06-12Ostatnia aktualizacja:2026-06-12

Prześlij ten dokument do swojego ulubionego asystenta AIChatGPT Claude DeepSeek Google AI mode Gemini Perplexity Mistral Grok

Zadaj pytanie i otrzymaj streszczenie dokumentu, odwołując się do tej strony i wybranego dostawcy AI

Historia wersji

"Wydanie funkcji dynamicznej zawartości"
v9.0.012.06.2026

Treść tej strony została przetłumaczona przy użyciu sztucznej inteligencji.

Zobacz ostatnią wersję oryginalnej treści w języku angielskim

Edytuj tę dokumentację

Jeśli masz pomysł na ulepszenie tej dokumentacji, zachęcamy do przesłania pull requesta na GitHubie.

Link do dokumentacji na GitHubie

Kopiuj

Kopiuj dokument Markdown do schowka

Rekordy Dynamiczne

Name: Intlayer
Author: Intlayer

Rekord dynamiczny (dynamic record) to plik zawartości, którego tożsamość nie opiera się na sekwencyjnym indeksie ani nazwanym wariancie, lecz na dowolnym zestawie par klucz-wartość zadeklarowanych w polu meta. Intlayer używa tych pól jako selektora w czasie wykonywania programu, co umożliwia odwoływanie się do rekordów CMS, treści specyficznych dla użytkownika lub dowolnych danych, których klucze nie są znane na etapie kompilacji.

Deklarowanie rekordów dynamicznych

product-copy.abc.content.ts

Kopiuj kod

Skopiuj kod do schowka

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

Kopiuj kod

Skopiuj kod do schowka

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;

Używanie rekordów dynamicznych

Wszystkie pola meta są wymagane w selektorze. Pominięcie któregokolwiek z pól zwraca null i powoduje błąd TypeScript.

ProductCopy.tsx

Kopiuj kod

Skopiuj kod do schowka

import { useIntlayer } from "react-intlayer";

export const ProductCopy = ({
  productId,
  userId,
}: {
  productId: string;
  userId: string;
}) => {
  const content = useIntlayer("product-copy", { id: productId, userId });
  // TypeScript wymaga dostarczenia zarówno `id`, jak i `userId`.

  if (!content) return null;

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

ProductCopy.tsx

Kopiuj kod

Skopiuj kod do schowka

import { useIntlayer } from "next-intlayer";

export const ProductCopy = ({
  productId,
  userId,
}: {
  productId: string;
  userId: string;
}) => {
  const content = useIntlayer("product-copy", { id: productId, userId });
  // TypeScript wymaga dostarczenia zarówno `id`, jak i `userId`.

  if (!content) return null;

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

ProductCopy.vue

Kopiuj kod

Skopiuj kod do schowka

<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

Kopiuj kod

Skopiuj kod do schowka

<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

Kopiuj kod

Skopiuj kod do schowka

import { useIntlayer } from "preact-intlayer";

export const ProductCopy = ({
  productId,
  userId,
}: {
  productId: string;
  userId: string;
}) => {
  const content = useIntlayer("product-copy", { id: productId, userId });
  // TypeScript wymaga dostarczenia zarówno `id`, jak i `userId`.

  if (!content) return null;

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

ProductCopy.tsx

Kopiuj kod

Skopiuj kod do schowka

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 wymaga dostarczenia zarówno `id`, jak i `userId`.

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

product-copy.component.ts

Kopiuj kod

Skopiuj kod do schowka

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

Kopiuj kod

Skopiuj kod do schowka

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>`;}

Ze specyficzną lokalizacją

tsx

Kopiuj kod

Skopiuj kod do schowka

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

Brak pola meta — błąd na etapie kompilacji

Kopiuj kod

Skopiuj kod do schowka

// Błąd typu: brakuje `userId`const content = useIntlayer("product-copy", { id: "prod_abc" });

Tryb ładowania (loading mode)

Rekordy dynamiczne są zazwyczaj ładowane leniwie (lazy loading). Możesz to skonfigurować w słowniku za pomocą pola importMode:

Kopiuj kod

Skopiuj kod do schowka

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

export default dictionary;

Szczegółowe informacje o trybach static, dynamic i fetch znajdziesz w sekcji optymalizacja paczek (bundle optimization).

Typowe przypadki użycia

Teksty marketingowe produktów zarządzane przez CMS
Treści specyficzne dla użytkownika lub konta
Dowolna zawartość pobierana na podstawie nieprzezroczystego identyfikatora runtime ID

Warianty Plik dla każdej lokalizacji