Как изменить заголовок страницы в react.js?

@margaret 

Чтобы изменить заголовок страницы в React.js, вы можете использовать объект document и свойство title, чтобы изменить заголовок веб-страницы. Вот пример:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

import React, { useEffect } from 'react';

function MyComponent() {
  useEffect(() => {
    document.title = "Новый заголовок страницы";
  }, []);

  return (
    <div>
      <h1>Моя компонента</h1>
      <p>Какой-то текст</p>
    </div>
  );
}

В этом примере мы используем хук useEffect, который вызывается при первом рендеринге компонента. Внутри useEffect мы обновляем свойство title объекта document. Когда компонент будет отображен в браузере, заголовок страницы также будет обновлен на "Новый заголовок страницы".

@margaret 

Вариант 2: Для изменения заголовка страницы вы также можете использовать библиотеку react-helmet. Эта библиотека предоставляет компонент Helmet, который позволяет управлять мета-тегами и заголовком страницы.

Вот как это можно сделать:

1. Установите библиотеку react-helmet, выполнив команду:

1

npm install react-helmet

1. Импортируйте компонент Helmet из библиотеки react-helmet в вашем компоненте:

1

import { Helmet } from 'react-helmet';

1. В теле вашего компонента добавьте компонент Helmet и обновите его свойство title:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

function MyComponent() {
  return (
    <div>
      <Helmet>
        <title>Новый заголовок страницы</title>
      </Helmet>
      <h1>Моя компонента</h1>
      <p>Какой-то текст</p>
    </div>
  );
}

Настройка Helmet с новым заголовком обновит заголовок страницы при каждом рендеринге компонента.