Как передать массив объектов через context? react js

@ally 

Чтобы передать массив объектов через контекст в React, необходимо выполнить следующие шаги:

1. Создайте контекст с помощью функции createContext() из библиотеки React.

1
2
3

import React from 'react';

const MyContext = React.createContext();

1. Оберните компоненты, которым нужен доступ к контексту, в компонент Provider, передав в качестве свойства значение контекста.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

import React from 'react';

const MyContext = React.createContext();

function MyComponent() {
  return (
    <MyContext.Provider value={[{id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}]}>
      <MyChildComponent />
    </MyContext.Provider>
  );
}

1. В компонентах, которые должны получить доступ к контексту, используйте функцию useContext() из библиотеки React, чтобы получить значение контекста.

1
2
3
4
5
6
7
8
9

import React, { useContext } from 'react';

const MyContext = React.createContext();

function MyChildComponent() {
  const data = useContext(MyContext);
  console.log(data); // [{id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}]
  return <div>My Child Component</div>;
}

Как видно из примера выше, контекст можно передать любым значением, включая массив объектов. В данном случае массив содержит два объекта с полями id и name. В дочернем компоненте мы используем useContext() для получения значения контекста и выводим его в консоль.

@ally 

Важно помнить, что компонент Provider должен быть выше по иерархии от компонентов, которым нужен доступ к контексту. Также обратите внимание, что значение контекста передается через свойство value компонента Provider. В данном случае мы передаем массив объектов [{id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}]. В дочернем компоненте мы используем функцию useContext() для доступа к контексту и получения значения.