Ajukan pertanyaan Anda dan dapatkan ringkasan dokumen dengan merujuk halaman ini dan penyedia AI pilihan Anda
Riwayat Versi
- "Dekorasi otomatis konten penyisipan"v8.0.018/1/2026
- "Inisialisasi riwayat"v5.5.1029/6/2025
Konten halaman ini diterjemahkan menggunakan AI.
Lihat versi terakhir dari konten aslinya dalam bahasa InggrisIf you have an idea for improving this documentation, please feel free to contribute by submitting a pull request on GitHub.
GitHub link to the documentationCopy doc Markdown to clipboard
Konten Penyisipan / Penyisipan di Intlayer
Cara Kerja Penyisipan
Di Intlayer, konten penyisipan dicapai melalui fungsi insertion, yang mengidentifikasi bidang placeholder dalam sebuah string (seperti {{name}} atau {{age}}) yang dapat diganti secara dinamis saat runtime. Pendekatan ini memungkinkan Anda membuat string yang fleksibel seperti template di mana bagian tertentu dari konten ditentukan oleh data yang dikirim dari aplikasi Anda.
Saat diintegrasikan dengan React Intlayer atau Next Intlayer, Anda cukup menyediakan objek data yang berisi nilai untuk setiap placeholder, dan Intlayer akan secara otomatis merender konten dengan placeholder yang sudah diganti.
Menyiapkan Konten Penyisipan
Untuk menyiapkan konten penyisipan dalam proyek Intlayer Anda, buat modul konten yang mencakup definisi penyisipan Anda.
Gunakan fungsi insert untuk mendeklarasikan konten penyisipan secara eksplisit.
Menggunakan Konten Insertion dengan React Intlayer
Untuk memanfaatkan konten insertion dalam sebuah komponen React, impor dan gunakan hook useIntlayer dari paket react-intlayer. Hook ini mengambil konten untuk kunci yang ditentukan dan memungkinkan Anda untuk mengirimkan sebuah objek yang memetakan setiap placeholder dalam konten Anda ke nilai yang ingin Anda tampilkan.
Salin kode ke clipboard
import type { FC } from "react";
import { useIntlayer } from "react-intlayer";
const InsertionComponent: FC = () => {
const { myInsertion } = useIntlayer("my_key");
return (
<div>
<p>
{
/* Output: "Halo, nama saya John dan saya berumur 30 tahun!" */
myInsertion({ name: "John", age: "30" })
}
</p>
<p>
{
/* Anda dapat menggunakan kembali insertion yang sama dengan nilai yang berbeda */
myInsertion({ name: "Alice", age: "25" })
}
</p>
</div>
);
};
export default InsertionComponent;Sumber Daya Tambahan
Untuk informasi lebih rinci tentang konfigurasi dan penggunaan, lihat sumber daya berikut:
Sumber daya ini menawarkan wawasan lebih lanjut tentang pengaturan dan penggunaan Intlayer di berbagai lingkungan dan framework.