Блог

У меня есть ReactJS родительский функциональный компонент, который отображает 6 дочерние компоненты с помощью реквизита. С помощью NextJS маршрута API я могу отображать каждый FaunaDB документ для каждого дочернего компонента. Один из реквизитов — «подсчет лайков».

Проблема в том, что я не знаю, как написать маршрут API, который позволит кнопке «Сердце» на каждом компоненте обновлять только тот компонент, который похож на счетчик, если нажать. Причина моих трудностей заключается в том, что API обновления обычно требует ссылки на документ, но, поскольку существует 6 документов (по одному для каждого дочернего компонента), это будет означать 6 маршрутов API, что неэффективно.

Что мне нужно, так это один API для обновления количества похожих, независимо от дочернего компонента, с которым взаимодействуют, и увеличения количества похожих с помощью щелчка.

Как я могу это сделать?

Один из вариантов-создать новый документ, в котором хранится количество подобных для каждой бумаги по индексу, и передать его родительскому и дочерним компонентам. Затем на эту коллекцию можно ссылаться через NextJS интерфейс. Но я не уверен, как условно отображать FaunaDB данные, чтобы в первую очередь отображалось количество подобных.

Другой вариант-создать индекс из коллекции документа, но я не уверен, как ссылаться на индекс из интерфейса.

Я думаю, что правильное решение может отображать массив значений и просто изменять конкретное значение, о котором идет речь, когда пользователь нажимает. Но опять же, я не уверен, как вы можете выборочно отображать FaunaDB массив в NextJS / React интерфейсе в первую очередь.

Примечание:

Я не возражаю против переписывания db данных (вручную), так как для начала это небольшой набор данных.