您好！您需要使用useState和useEffect钩子。
了解更多关于hooks的信息：https://react.dev/reference/react/useState和https://react.dev/reference/react/useEffect

import './App.css';
import RealDolar from './components/real_dolar.js';
    
function App() {
  const [realDolar, setRealDolar] = useState(0);
  const url = 'https://api.freecurrencyapi.com/v1/latest? 
  base_currency=USD&currencies=BRL&apikey=xyz';

  useEffect(() => {
    fetch(url).then(res=>{
      return res.json()
    }).then(json=>{
      setRealDolar(json['data']['BRL']);
    })
  }, [])
     
  return (
    <div className="Real_Rapido">
      <RealDolar cotacao={realDolar} />
      </div>
  );
}

export default App;

传递的prop应该是一个state：

function App() {
  const [realDolar, setRealDolar] = useState(0);
  useEffect(() => {
    let url = 'https://api.freecurrencyapi.com/v1/latest?base_currency=USD&currencies=BRL&apikey=xyz';
    fetch(url).then(res=>{
      return res.json()
    }).then(json=>{
      setRealDolar(json['data']['BRL'])
    })
  }, [])
  return (
    <div className="Real_Rapido">
      <RealDolar cotacao={realDolar} />
    </div>
  );
}