Memasukkan HTML dengan Penyata Pembolehubah React (JSX)
Dalam pembangunan React, anda mungkin menghadapi keperluan untuk memasukkan kandungan HTML secara dinamik menggunakan pembolehubah React penyata (JSX). Soalan ini mencari penyelesaian untuk memasukkan HTML yang disimpan dalam pembolehubah ke dalam komponen React dan menjadikannya seperti yang dimaksudkan.
Kunci untuk mencapainya terletak pada penggunaan atribut dangerouslySetInnerHTML. Atribut ini membolehkan anda menetapkan HTML dalaman elemen secara langsung, membolehkan anda menyuntik kandungan HTML secara dinamik.
Untuk menggunakan atribut dangerouslySetInnerHTML, anda boleh mengubah suai kod anda seperti berikut:
<code class="javascript">render: function() {
return (
<div className="content" dangerouslySetInnerHTML={{__html: thisIsMyCopy}}></div>
);
}</code>Dalam kod ini, pembolehubah thisIsMyCopy mengandungi kandungan HTML yang ingin anda masukkan. Atribut dangerouslySetInnerHTML kemudian menetapkan HTML dalaman bagi
Perlu ambil perhatian bahawa penggunaan dangerouslySetInnerHTML harus dilakukan dengan berhati-hati, kerana ia boleh memperkenalkan potensi kelemahan keselamatan. Anda disyorkan untuk menggunakannya hanya apabila perlu dan membersihkan kandungan HTML dengan teliti sebelum menetapkannya.
Atas ialah kandungan terperinci Bagaimana untuk Memasukkan Kandungan HTML Secara Dinamik Menggunakan Penyata Pembolehubah React (JSX)?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
