</code> <code> </code> </code</a></li> <li class="ps-2"><a href="#usage">Використання</a></li> <li class="ps-3"><a href="#displaying-a-text-area">Відображення текстової області</a></li> <li class="ps-3"><a href="#providing-a-label-for-a-text-area">Надання мітки для текстової області</a></li> <li class="ps-3"><a href="#providing-an-initial-value-for-a-text-area">Надання початкового значення для текстової області</a></li> <li class="ps-3"><a href="#reading-the-text-area-value-when-submitting-a-form">Читання значення текстової області при відправленні форми</a></li> <li class="ps-3"><a href="#controlling-a-text-area-with-a-state-variable">Керування текстовою областю за допомогою змінної стану</a></li> <li class="ps-2"><a href="#troubleshooting">Виправлення помилок</a></li> <li class="ps-3"><a href="#my-text-area-doesnt-update-when-i-type-into-it">Моє текстове поле не оновлюється, коли я вводжу в нього текст</a></li> <li class="ps-3"><a href="#my-text-area-caret-jumps-to-the-beginning-on-every-keystroke">При кожному натисканні клавіш у моїй текстовій області курсор введення перескакує на початок</a></li> <li class="ps-3"><a href="#im-getting-an-error-a-component-is-changing-an-uncontrolled-input-to-be-controlled">Я отримую помилку: "Компонент змінює неконтрольований вхід на контрольований"</a></li> </ul> </nav> </div> <div class="col-md-6 col-sm-12 order-md-2" > <h1><textarea></h1> <MaxWidth> <Intro> <p>Вбудований компонент браузера <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea" target="_blank" rel="nofollow noopener noreferrer"> <code><textarea></code> </a> дозволяє відображати багаторядкове введення тексту.</p> <pre><code class="language-js"><textarea /></code></pre> </Intro> <InlineToc /> <hr /> <h2 id="reference">Довідник</h2> <h3 id="textarea"><code><textarea></code></h3> <p>Щоб відобразити текстову область, викличте компонент <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea" target="_blank" rel="nofollow noopener noreferrer">вбудованого браузера <code><textarea></code></a>.</p> <pre><code class="language-js"><textarea name="postContent" /></code></pre> <p><a href="#usage">Дивіться більше прикладів нижче.</a></p> <h4 id="props"> Пропси </h4> <p><code><textarea></code> підтримує всі <a href="/reference/react-dom/components/common#props"> пропси спільних елементів.</a></p> <p>Ви можете <a href="#controlling-a-text-area-with-a-state-variable"> зробити текстову область керованою</a>, передавши <code> значення</code> prop:</p> <ul> <li><code>value</code>: Рядок. Керує текстом всередині текстової області.</li> </ul> <p>При передачі <code>значення</code> ви також повинні передати обробник <code>onChange</code>, який оновлює передане значення.</p> <p>Якщо ваш <code><textarea></code> є неконтрольованим, ви можете передати замість нього проп <code>defaultValue</code>:</p> <ul> <li><code>defaultValue</code>: Рядок. Вказує <a href="#providing-an-initial-value-for-a-text-area"> початкове значення </a> для текстової області.</li> </ul> <p>Ці <code><textarea></code> пропси стосуються як неконтрольованих, так і контрольованих текстових областей:</p> <ul> <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#autocomplete" target="_blank" rel="nofollow noopener noreferrer"><code>autoComplete</code></a>: Або <code>'on'</code>, або <code>'off'</code>. Вказує поведінку автозаповнення.</li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#autofocus" target="_blank" rel="nofollow noopener noreferrer"><code>autoFocus</code></a>: Булевий вираз. Якщо <code>true</code>, React сфокусує елемент на mount.</li>. <li><code>children</code>: <code><textarea></code> не приймає дітей. Для встановлення початкового значення використовуйте <code>defaultValue</code>.</li>. <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#cols" target="_blank" rel="nofollow noopener noreferrer"><code>cols</code></a>: Число. Вказує ширину за замовчуванням у середній ширині символів. За замовчуванням <code>20</code>.</li>. <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#disabled" target="_blank" rel="nofollow noopener noreferrer"><code>disabled</code></a>: Булевий вираз. Якщо <code>true</code>, введення не буде інтерактивним і буде виглядати затемненим.</li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#form" target="_blank" rel="nofollow noopener noreferrer"><code>form</code></a>: Рядок. Вказує <code>id</code> елемента <code><form></code>, до якого належить цей вхід. Якщо не вказано, це найближча батьківська форма.</li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#maxlength" target="_blank" rel="nofollow noopener noreferrer"><code>maxLength</code></a>: Число. Вказує максимальну довжину тексту.</li>. <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#minlength" target="_blank" rel="nofollow noopener noreferrer"><code>minLength</code></a>: Число. Вказує мінімальну довжину тексту.</li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name" target="_blank" rel="nofollow noopener noreferrer"><code>name</code></a>: Рядок. Вказує назву для цього входу, який <a href="#reading-the-textarea-value-when-submitting-a-form"> було надіслано разом з формою.</a></li> <li><code>onChange</code>: Функція-обробник <a href="/reference/react-dom/components/common#event-handler"><code>Event</code> </a>. Потрібна для <a href="#controlling-a-text-area-with-a-state-variable"> контрольованих текстових областей.</a> Спрацьовує негайно, коли користувач змінює значення входу (наприклад, спрацьовує при кожному натисканні клавіші). Поводиться як браузер <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event" target="_blank" rel="nofollow noopener noreferrer"><code>input</code> event.</a></li> <li><code>onChangeCapture</code>: Версія <code>onChange</code>, яка спрацьовує у фазі <a href="/learn/responding-to-events#capture-phase-events"> захоплення.</a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event" target="_blank" rel="nofollow noopener noreferrer"><code>onInput</code></a>: Функція-обробник <a href="/reference/react-dom/components/common#event-handler"><code>Event</code> </a>. функція. Спрацьовує негайно, коли значення змінюється користувачем. З історичних причин у React ідіоматично використовувати <code>onChange</code>, яка працює аналогічно.</li> <li><code>onInputCapture</code>: Версія <code>onInput</code>, яка спрацьовує у фазі <a href="/learn/responding-to-events#capture-phase-events"> захоплення.</a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/invalid_event" target="_blank" rel="nofollow noopener noreferrer"><code>onInvalid</code></a>: Функція-обробник <a href="/reference/react-dom/components/common#event-handler"><code>Event</code> </a>. Спрацьовує, якщо вхідні дані не пройшли валідацію при надсиланні форми. На відміну від вбудованої події <code>invalid</code>, подія React <code>onInvalid</code> bubbles.</li> <li><code>onInvalidCapture</code>: Версія <code>onInvalid</code>, яка спрацьовує у фазі <a href="/learn/responding-to-events#capture-phase-events"> захоплення.</a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement/select_event" target="_blank" rel="nofollow noopener noreferrer"><code>onSelect</code></a>: Функція-обробник <a href="/reference/react-dom/components/common#event-handler"><code>Event</code> </a>. Спрацьовує після зміни виділення всередині <code><textarea></code>. React розширює подію <code>onSelect</code>, щоб вона спрацьовувала також для порожнього виділення та при редагуванні (яке може вплинути на виділення).</li> <li><code>onSelectCapture</code>: Версія <code>onSelect</code>, яка спрацьовує у фазі <a href="/learn/responding-to-events#capture-phase-events"> захоплення.</a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#placeholder" target="_blank" rel="nofollow noopener noreferrer"><code>placeholder</code></a>: Рядок. Відображається тьмяним кольором, якщо значення текстової області порожнє.</li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#readonly" target="_blank" rel="nofollow noopener noreferrer"><code>readOnly</code></a>: Логічне значення. Якщо <code>true</code>, текстова область недоступна для редагування користувачем.</li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#required" target="_blank" rel="nofollow noopener noreferrer"><code>required</code></a>: Булеве значення. Якщо <code>true</code>, значення має бути надано формі для відправки.</li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#rows" target="_blank" rel="nofollow noopener noreferrer"><code>rows</code></a>: Число. Вказує висоту за замовчуванням у середніх висотах символів. За замовчуванням <code>2</code>.</li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#wrap" target="_blank" rel="nofollow noopener noreferrer"><code>wrap</code></a>: Або <code>'hard'</code>, <code>'soft'</code>, або <code>'off'</code>. Вказує, як слід обгортати текст при надсиланні форми.</li> </ul> <h4 id="caveats">Застереження</h4> <ul> <li>Не дозволяється пропускати таких дітей, як <code><textarea>something</textarea></code>. <a href="#providing-an-initial-value-for-a-text-area">Використовуйте <code>defaultValue</code> для початкового вмісту.</a></li> <li>Якщо текстова область отримує проп <code>значення </code>, вона буде <a href="#controlling-a-text-area-with-a-state-variable">оброблена як керована.</a></li> <li>Текстова область не може бути одночасно контрольованою та неконтрольованою.</li> <li>Текстова область не може перемикатися між контрольованою та неконтрольованою протягом свого життя.</li> <li>Кожна контрольована текстова область потребує обробник подій <code>onChange</code>, який синхронно оновлює її опорне значення.</li> </ul> <hr /> <h2 id="usage">Використання</h2> <h3 id="displaying-a-text-area"> Відображення текстової області</h3> <p>Зобразити <code><textarea></code> для відображення текстової області. За допомогою атрибутів <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#rows" target="_blank" rel="nofollow noopener noreferrer"><code>rows</code></a> та <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#cols" target="_blank" rel="nofollow noopener noreferrer"><code>cols</code></a> можна вказати її розмір за замовчуванням, але за замовчуванням користувач матиме змогу змінити її розмір. Щоб вимкнути зміну розміру, ви можете вказати <code>resize: none</code> в CSS.</p> </MaxWidth> <Sandpack> <pre><code class="language-js">export default function NewPost() { return ( <label> Write your post: <textarea name="postContent" rows={4} cols={40} /> </label> ); }</code></pre> <pre><code class="language-css">input { margin-left: 5px; } textarea { margin-top: 10px; } label { margin: 10px; } label, textarea { display: block; }</code></pre> </Sandpack> <MaxWidth> <hr /> <h3 id="providing-a-label-for-a-text-area"> Надання мітки для текстової області</h3> <p>Зазвичай, ви розміщуєте кожну <code><textarea></code> всередині тегу <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label" target="_blank" rel="nofollow noopener noreferrer"><code><label></code></a>. Це повідомляє браузеру, що ця мітка пов'язана з цією текстовою областю. Коли користувач клацне на мітці, браузер сфокусує текстову область. Це також важливо для доступності: програма для читання з екрана озвучить підпис мітки, коли користувач сфокусує текстову область.</p> <p>Якщо ви не можете вкласти <code><textarea></code> у <code><label></code>, об'єднайте їх, передавши однаковий ідентифікатор <code><textarea id></code> та <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLLabelElement/htmlFor" target="_blank" rel="nofollow noopener noreferrer"><code><label htmlFor></code>. </a> Щоб уникнути конфліктів між екземплярами одного компонента, згенеруйте такий ідентифікатор за допомогою <a href="/reference/react/useId"><code>useId</code>.</a></p> </MaxWidth> <Sandpack> <pre><code class="language-js">import { useId } from 'react'; export default function Form() { const postTextAreaId = useId(); return ( <> <label htmlFor={postTextAreaId}> Write your post: </label> <textarea id={postTextAreaId} name="postContent" rows={4} cols={40} /> </> ); }</code></pre> <pre><code class="language-css">input { margin: 5px; }</code></pre> </Sandpack> <MaxWidth> <hr /> <h3 id="providing-an-initial-value-for-a-text-area">Надання початкового значення для текстової області</h3> <p>За бажанням ви можете вказати початкове значення для текстової області. Передайте його як рядок <code>defaultValue</code>.</p> </MaxWidth> <Sandpack> <pre><code class="language-js">export default function EditPost() { return ( <label> Edit your post: <textarea name="postContent" defaultValue="I really enjoyed biking yesterday!" rows={4} cols={40} /> </label> ); }</code></pre> <pre><code class="language-css">input { margin-left: 5px; } textarea { margin-top: 10px; } label { margin: 10px; } label, textarea { display: block; }</code></pre> </Sandpack> <MaxWidth> <Pitfall><p>На відміну від HTML, передача початкового тексту на зразок <code><textarea>Some content</textarea></code> не підтримується.</p></Pitfall> <hr /> <h3 id="reading-the-text-area-value-when-submitting-a-form">Зчитування значення текстової області під час надсилання форми</h3> <p>Додайте <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form" target="_blank" rel="nofollow noopener noreferrer"><code><form></code></a> навколо вашої текстової області з <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button" target="_blank" rel="nofollow noopener noreferrer"><code><button type="submit"></code></a> всередині. Він викличе ваш обробник події <code><form onSubmit></code>. За замовчуванням браузер відправить дані форми на поточну URL-адресу і оновить сторінку. Ви можете змінити цю поведінку, викликавши <code>e.preventDefault()</code>. Прочитайте дані форми за допомогою <a href="https://developer.mozilla.org/en-US/docs/Web/API/FormData" target="_blank" rel="nofollow noopener noreferrer"><code>new FormData(e.target)</code></a>.</p> </MaxWidth> <Sandpack> <pre><code class="language-js">export default function EditPost() { function handleSubmit(e) { // Prevent the browser from reloading the page e.preventDefault(); // Read the form data const form = e.target; const formData = new FormData(form); // You can pass formData as a fetch body directly: fetch('/some-api', { method: form.method, body: formData }); // Or you can work with it as a plain object: const formJson = Object.fromEntries(formData.entries()); console.log(formJson); } return ( <form method="post" onSubmit={handleSubmit}> <label> Post title: <input name="postTitle" defaultValue="Biking" /> </label> <label> Edit your post: <textarea name="postContent" defaultValue="I really enjoyed biking yesterday!" rows={4} cols={40} /> </label> <hr /> <button type="reset">Reset edits</button> <button type="submit">Save post</button> </form> ); }</code></pre> <pre><code class="language-css">label { display: block; } input { margin: 5px; }</code></pre> </Sandpack> <MaxWidth> <Note><p>Дайте <code> ім'я </code> вашому <code><textarea></code>, наприклад <code><textarea name="postContent" /></code>. Вказане вами <code>name</code> буде використано як ключ у даних форми, наприклад <code>{ postContent: "Your post" }</code>.</p></Note> <Pitfall><p>За замовчуванням, <em>будь-який </em> <code><button></code> всередині <code><form></code> надішле його. Це може бути несподівано! Якщо у вас є власний кастомний <code>Button</code> React-компонент, розгляньте можливість повернення <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/button" target="_blank" rel="nofollow noopener noreferrer"><code><button type="button"></code></a> замість <code><button></code>. Тоді, для більшої ясності, використовуйте <code><button type="submit"></code> для кнопок, які <em>мають </em> надсилати форму.</p></Pitfall> <hr /> <h3 id="controlling-a-text-area-with-a-state-variable"> Керування текстовою областю за допомогою змінної стану</h3> <p>Текстова область на зразок <code><textarea /></code> є <em>неконтрольованою.</em> Навіть якщо ви <a href="#providing-an-initial-value-for-a-text-area"> передасте початкове значення</a> як <code><textarea defaultValue="Initial text" /></code>, ваш JSX вказує лише початкове значення, а не значення у даний момент.</p> <p><strong>Щоб відрендерити <em>контрольовану</em> текстову область, передайте їй проп <code>value</code>.</strong> React змусить текстову область завжди мати передане вами значення <code>value</code>. Зазвичай ви керуєте текстовою областю, оголошуючи змінну стану <a href="/reference/react/useState">:</a></p> <pre><code data-meta="{2,6,7}" class="language-js">function NewPost() { const [postContent, setPostContent] = useState(''); // Declare a state variable... // ... return ( <textarea value={postContent} // ...force the input's value to match the state variable... onChange={e => setPostContent(e.target.value)} // ... and update the state variable on any edits! /> ); }</code></pre> <p>Це корисно, якщо ви хочете повторно відрендерити якусь частину інтерфейсу у відповідь на кожне натискання клавіші.</p> </MaxWidth> <Sandpack> <pre><code class="language-js">import { useState } from 'react'; import MarkdownPreview from './MarkdownPreview.js'; export default function MarkdownEditor() { const [postContent, setPostContent] = useState('_Hello,_ **Markdown**!'); return ( <> <label> Enter some markdown: <textarea value={postContent} onChange={e => setPostContent(e.target.value)} /> </label> <hr /> <MarkdownPreview markdown={postContent} /> </> ); }</code></pre> <pre><code data-meta="src/MarkdownPreview.js" class="language-js">import { Remarkable } from 'remarkable'; const md = new Remarkable(); export default function MarkdownPreview({ markdown }) { const renderedHTML = md.render(markdown); return <div dangerouslySetInnerHTML={{__html: renderedHTML}} />; }</code></pre> <pre><code data-meta="package.json" class="language-json">{ "dependencies": { "react": "latest", "react-dom": "latest", "react-scripts": "latest", "remarkable": "2.0.1" }, "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test --env=jsdom", "eject": "react-scripts eject" } }</code></pre> <pre><code class="language-css">textarea { display: block; margin-top: 5px; margin-bottom: 10px; }</code></pre> </Sandpack> <MaxWidth> <Pitfall><p><strong>Якщо ви передасте <code>значення</code> без <code>onChange</code>, ввести текст у текстову область буде неможливо. </strong> Коли ви керуєте текстовим полем, передаючи йому деяке <code>значення</code>, ви <em>примушуєте</em> його завжди мати значення, яке ви передали. Отже, якщо ви передасте змінну стану як <code>значення</code>, але забудете синхронно оновити цю змінну стану під час обробника події <code>onChange</code>, React повертатиме текстову область після кожного натискання клавіші до вказаного вами <code>значення</code>.</p></Pitfall> <hr /> <h2 id="troubleshooting">Налагодження</h2> <h3 id="my-text-area-doesnt-update-when-i-type-into-it"> Моя текстова область не оновлюється, коли я вводжу в неї текст</h3> <p>Якщо ви відрендерите текстову область із <code>значенням </code>, але без <code>onChange</code>, ви побачите помилку у консолі:</p> <pre><code class="language-js">// 🔴 Bug: controlled text area with no onChange handler <textarea value={something} /></code></pre> <ConsoleBlock data-level="error"><p>Ви надали проп <code>значення</code> полю форми без обробника <code>onChange</code>. Це призведе до того, що поле буде доступне лише для читання. Якщо поле має бути змінюваним, використовуйте <code>defaultValue</code>. В іншому випадку задайте або <code>onChange</code>, або <code>readOnly</code>.</p></ConsoleBlock> <p>Як випливає з повідомлення про помилку, якщо ви хотіли <a href="#providing-an-initial-value-for-a-text-area">вказати лише <em>початкове </em>значення,</a> передайте <code>defaultValue</code> замість цього:</p> <pre><code class="language-js">// ✅ Good: uncontrolled text area with an initial value <textarea defaultValue={something} /></code></pre> <p>Якщо ви хочете <a href="#controlling-a-text-area-with-a-state-variable">керувати цією текстовою областю за допомогою змінної стану,</a> вкажіть <code>onChange</code> обробник:</p> <pre><code class="language-js">// ✅ Good: controlled text area with onChange <textarea value={something} onChange={e => setSomething(e.target.value)} /></code></pre> <p>Якщо значення навмисно призначено лише для читання, додайте проп <code>readOnly</code> для придушення помилки:</p> <pre><code class="language-js">// ✅ Good: readonly controlled text area without on change <textarea value={something} readOnly={true} /></code></pre> <hr /> <h3 id="my-text-area-caret-jumps-to-the-beginning-on-every-keystroke"> Мій маркер текстової області перескакує на початок після кожного натискання клавіші</h3> <p>Якщо ви <a href="#controlling-a-text-area-with-a-state-variable">контролюєте текстову область,</a> ви повинні оновити її змінну стану до значення текстової області з DOM протягом <code>onChange</code>.</p> <p>Ви не можете оновити його на щось інше, ніж <code>e.target.value</code>:</p> <pre><code class="language-js">function handleChange(e) { // 🔴 Bug: updating an input to something other than e.target.value setFirstName(e.target.value.toUpperCase()); }</code></pre> <p>Ви також не можете оновлювати його асинхронно:</p> <pre><code class="language-js">function handleChange(e) { // 🔴 Bug: updating an input asynchronously setTimeout(() => { setFirstName(e.target.value); }, 100); }</code></pre> <p>Щоб виправити код, синхронно оновіть його до <code>e.target.value</code>:</p> <pre><code class="language-js">function handleChange(e) { // ✅ Updating a controlled input to e.target.value synchronously setFirstName(e.target.value); }</code></pre> <p>Якщо це не вирішило проблему, можливо, що текстова область видаляється і знову додається з DOM при кожному натисканні клавіші. Це може статися, якщо ви випадково <a href="/learn/preserving-and-resetting-state"> скидаєте стан </a> при кожному повторному рендерингу. Наприклад, це може статися, якщо текстова область або один з її батьків завжди отримує інший атрибут <code>ключа</code>, або якщо ви вкладаєте визначення компонентів (що не дозволено в React і призводить до того, що "внутрішній" компонент перемонтується при кожному рендерингу).</p> <hr /> <h3 id="im-getting-an-error-a-component-is-changing-an-uncontrolled-input-to-be-controlled">Я отримую помилку: "Компонент змінює неконтрольований вхід на контрольований"</h3> <p>Якщо ви надаєте компоненту <code>значення</code>, воно має залишатися рядком протягом усього його життя.</p> <p>Ви не можете передати спочатку <code>value={undefined}</code>, а потім <code>value="some string"</code>, оскільки React не знатиме, чи хочете ви зробити компонент некерованим чи керованим. Керований компонент завжди повинен отримувати рядок <code>value</code>, а не <code>null</code> або <code>undefined</code>.</p> <p>Якщо ваше <code>значення</code> надходить з API або змінної стану, воно може бути ініціалізоване <code>null</code> або <code>undefined</code>. У такому випадку або спочатку встановіть його як порожній рядок (<code>''</code>), або передайте <code>value={someValue ?? ''}</code>, щоб переконатися, що <code>value</code> є рядком.</p> </MaxWidth> </div> </div> </main> <script src="/build/app.98fe3f9f.js"></script> <script> if (window.location.pathname === '/') window.location.href = '/learn'; </script> <!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-25LFHBE5LM"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-25LFHBE5LM'); </script> </body> </html> <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script>