Как определить фон для слайдера фона и как это исправить? - PullRequest
0 голосов
/ 20 апреля 2020

Я пытаюсь сделать фоновый слайдер для ресторана. и по этой причине я использовал gatsby-image-background-slider. когда я выполнил «gatsby development», он не показывает ошибки во время выполнения, но когда я пытаюсь просмотреть в localhost, он показывает ошибку «× TypeError: Невозможно прочитать свойство« фоны »неопределенного» * ​​1001 *

, можно найти исходный код здесь введите описание ссылки здесь

Я хотел использовать карусель, но я подумал, что будет лучше использовать этот плагин. Это моя первая попытка в Гэтсби. Я установил плагин и попробовал запрос в graphql. согласно документу gatsby-image-background-slider, нет упоминания о предоставлении каталога фонам. Я попытался ввести некоторые в относительный путь, но он показывает ошибку, и это не упоминается в документе.

Есть ли какие-либо идеи, как я могу избавиться от этой ошибки, или как я могу иметь фоновый слайдер или карусель, как вещь оптимизирующим способом?

1 Ответ

0 голосов
/ 20 апреля 2020

Вам необходимо изменить компонент BackgroundSection следующим образом:

export default function BackgroundSection({
  img,
  styleClass,
  children,
  title,
  query // you forgot this
}) {
  return (
    <BackgroundSlider className={styleClass} fluid={img} query={query}>
      <div class="container">
        <div class="row align-items-center justify-content-center">
          <div class="col-xl-9 col-md-9 col-md-12">
            <div class="slider_text text-center bold">
              <div>
                <h1>{title}</h1>
              </div>
              <div>
                <h1>{title}</h1>
              </div>
            </div>
          </div>
        </div>
      </div>

      {children}
    </BackgroundSlider>
  )
}

Вы забыли включить запрос и передать этот запрос в компонент BackgroundSLider

...