我正在尝试构建一个包含随机字母字符的5x5网格，除非文本输入具有值。如果该输入具有值，则网格中的两个单元格将填充该值，网格的其余部分将填充随机字母字符。如果输入没有值，网格将照常填充。

const alphabet = "abcdefghijklmnopqrstuvwxyz";

const getRandomLetterRow = (size) =>
  Array.from({ length: size }, () => {
    return alphabet[Math.floor(Math.random() * alphabet.length)];
  });

const generateGrid = (size = 5) => {
  return Array.from({ length: size }, () => {
    return getRandomLetterRow(size);
  });
};

    function App(){
             const [customLetter, setCustomLetter] = useState();
             const [grid, setGrid] = useState(generateGrid());

             console.log(grid);

             return(
                  <div>
                      <input
                           type="text"
                           placeholder="Type"
                           onChange={(e) => setCustomLetter(e.target.value)}
                      />
                  </div>
              )
    }

我找到了网格中充满随机字母字符的部分，但我不知道如何只用输入值填充两个单元格。如果输入有值，我需要能够创建数组，其中两个值是输入值，其余的将是随机字母字符，如果没有，它将像现在一样创建。