Terdapat komponen React yang menerima rentetan sebagai sifat:
interface MyProps { myInput: string; } export function MyComponent({ myInput }: MyProps) { ... return ( {myInput} ); };
Komponen ini digunakan di tempat lain:
Persoalan saya, bolehkah kita menukar warna alamat e-mel dalam kes ini? Contohnya, tukar kepada biru.
Atau lebih baik lagi, bungkus teks itu dalam:
test@test.com
Tidak pasti jika perkara seperti ini boleh dilakukan jika jenis harta itustring.
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Anda boleh melakukannya berdasarkan rentetan yang disediakan, tetapi lebih mudah jika alamat e-mel disediakan sebagai atribut yang berasingan
MyComponent.Tanpa menukar komponen, saya akan menggunakan beberapa regex mudah untuk mendapatkan alamat e-mel daripada rentetan dan kemudian anda boleh melakukan apa sahaja yang anda mahu.
Berikut ialah contoh ungkapan biasa yang ringkas dan tidak lengkap:
const SUPER_SIMPLE_EMAIL_REGEX = /[a-z0-9.]{1,}@test.com/gi; // 不要使用这个 export function MyComponent({ myInput }: MyProps) { const match = myInput.match(SUPER_SIMPLE_EMAIL_REGEX); if (!match.length) { return ( {myInput} ); } const textWithoutEmail = myInput.replace(match[0], ''); return ( {textWithoutEmail} match[0] ); };Ini adalah penyelesaian yang sangat mudah tetapi saya fikir anda boleh menggunakannya dalam kes anda.