How to use querySelector in React?

Question

React

You need to take the text from the div in JSX, I wrote the following code below the function with JSX:

import React from 'react';
import './App.css'

function App() {
    return(
        <div className='App'>
            <h3 className='text'>Text1</h3>
            <h3>Text: {text}</h3>
        </div>
    );
}

const text = document.querySelector('.text');


export default App;

How do I get text from classes in React? And refer to classes and somehow manipulate them.

Answer 1

there's no point in using react if you're accessing the content via .querySelectora hook instead, useStatestore your value in it and use the variable wherever you want. If necessary, you can change this value.
An example of creation and use. If you need to change, just write yes and it would not hurt to read the documentation of the hooks section.
const [ text, setText ] = React.useState('Text1');
<h3 className='text'>{text}</h3>
setText('новый текст');

Answer 2

You can do this:
https://stackoverflow.com/questions/61634308/alter...
But this is not a common way to use react. Try to avoid this approach whenever possible.