Sql experssion - выбрать из другой базы данных

Используйте Array.slice:

Метод slice() возвращает неглубокую копию части массива в новый объект массива, выбранный от начала до конца (конец не включен), где начало и конец представляют индекс элементов в этом массиве. Исходный массив не будет изменен.

Примечание 1: значения вашего имени в ваших объектах должны быть в кавычках.

Примечание 2: внутри ваших сопоставленных данных ваша разметка должна быть заключена либо в содержащий элемент, либо в фрагмент React.

Примечание 3: в идеале вы хотите добавить идентификатор к своим объектам, который вы можете использовать в качестве ключа для элемента-обертки (вместо использования индекса map).

const { useState } = React;

function Example({ data }) {
  return (
    <main>
      {data.slice(0, 2).map(obj => {
        return (
          <section key = {obj.id}>
            <h1>{obj.name}</h1>
            <h2>{obj.age}</h2>
          </section>
        );
      })} 
    </main>
  );
}

const data = [{id:1,name:'john',age:20},{id:2,name:'jack',age:24},{id:3,name:'rose',age:26},{id:4,name:'david',age:40}];

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<Example data = {data} />);

<script src = "https://cdnjs.cloudflare.com/ajax/libs/react/18.2.0/umd/react.development.min.js"></script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/react-dom/18.2.0/umd/react-dom.development.min.js"></script>
<div id = "root"></div>

Я вижу, это больше похоже на программирование, способов много. Кроме slice, который может быть лучшим безопасным способом. Если вы только начинаете программировать, вы также можете попробовать следующее.

[0,1].map(i => ( 
  <>
    <h1>{array[i].name}</h1>
    <h2>{array[i].age}</h1>
  </>
))

Как я уже сказал, это программирование, тогда делайте все, чтобы оно заработало. Например, просто дважды скопируйте и вставьте, что также решит вашу проблему. Или сделайте цикл и пропустите, когда индекс больше двух.