1. Создайте компонент List, который принимает функцию через props, и эта функция возвращает элементы списка (<li>). List должен рендерить эти элементы внутри <ul>. 2. Используйте List для отображения списка пунктов, где каждый пункт может иметь свой уникальный стиль или содержимое, определенное функцией render props.

import React from 'react';

class List extends React.Component {
  render() {
    const { renderItems } = this.props;
    
    return (
      <ul>
        {renderItems()}
      </ul>
    );
  }
}

class App extends React.Component {
  render() {
    return (
      <div>
        <h1>List of Items</h1>
        <List renderItems={() => (
          <>
            <li style={{ color: 'red' }}>Item 1</li>
            <li style={{ color: 'blue' }}>Item 2</li>
            <li style={{ color: 'green' }}>Item 3</li>
          </>
        )} />
      </div>
    );
  }
}

export default App;

В этом примере компонент List принимает функцию renderItems через props и вызывает её внутри рендера, чтобы отобразить элементы списка. В компоненте App используется List для отображения списка пунктов, каждый из которых имеет уникальный стиль, определенный внутри функции renderItems.