Сегодня мы сосредоточимся на создании контейнера изображения. Это может быть очень распространенный вопрос на собеседовании по интерфейсу, чтобы проверить, в основном, ваши базовые знания javascript и css.

Из-за отсутствия сложности кодовой базы нам не нужно создавать приложение React локально на рабочем столе. Давайте сделаем это в реагирующем коде и ящике.

Шаг 1: Перейдите к коду реагирования и ящику по этому URL-адресу:

https://codesandbox.io/s/react-codesandbox

Шаг 2: Зайдите в папку src и создайте photoapi.js со следующим содержимым:

здесь мы делаем простой вызов, чтобы получить список фотографий с URL-адресом и информацией о названии. URL-адрес будет добавлен в качестве атрибута в тег img, а заголовок будет использоваться для отображения описания изображения.

Шаг 3: Перейдите к index.js в той же папке и замените его следующим:

Здесь мы звоним, чтобы получить все фотографии. Мы также включили две кнопки для перемещения вперед и назад между разными фотографиями.

Вот как это выглядит:

Вот и все! Наслаждайтесь кодированием!

На простом английском

Спасибо, что являетесь частью нашего сообщества! Прежде чем уйти: