在React中，每次组件状态或属性更改时，都会重新渲染组件，这可能导致性能问题。当需要在组件中使用随机数或其他不必要的副作用时，会发生多次重新渲染的问题。为了避免这种情况，可以使用useMemo或useCallback来避免不必要的重新渲染。

示例代码：

import React, { useState, useMemo } from 'react';

function RandomNumber(props) {
  const { min, max } = props;
  const randomNumber = useMemo(() => {
    return Math.floor(Math.random() * (max - min + 1)) + min;
  }, [min, max]);

  return 
{randomNumber}
;
}

function App() {
  const [min, setMin] = useState(1);
  const [max, setMax] = useState(100);

  const handleMinChange = (event) => {
    setMin(parseInt(event.target.value));
  };

  const handleMaxChange = (event) => {
    setMax(parseInt(event.target.value));
  };

  return (
    

      
        Min:
        
      
      

      
        Max:
        
      
      

      
    
  );
}

export default App;

在这个例子中，当输入框中的最小或最大值更改时，RandomNumber组件将会重新渲染，但是使用useMemo来计算随机数，确保每次渲染都使用相同的随机数。