Есть ли способ использовать materializecss с Gatsby js?

когда я использую материализующий css, вам нужно использовать некоторые из их функций javascript, чтобы заставить CSS работать правильно

  componentDidMount() {
    //sidenav
    const sideNav = document.querySelector('.sidenav')
    const instance = M.Sidenav.init(sideNav, {})
  }

Эти компоненты используют окно в gatsby js. Gatsby js этого не допустит. кто-нибудь нашел способ обойти это?


gatsby materialize
person André Jarboe II    schedule 26.09.2018    source источник

Ответы (2)


arrow_upward
0
arrow_downward

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

person Romeo Mihalcea    schedule 27.09.2018

arrow_upward
0
arrow_downward

Вы можете инициализировать компонент materialize-css с помощью:

if (typeof window !== 'undefined') {
  require('materialize-css/dist/js/materialize.min.js')
}

class Navigation extends Component {
  componentDidMount() {
    const elem = document.querySelector('.sidenav')
    window.M.Sidenav.init(elem, {})
}

Я думаю, вы также можете использовать динамический импорт.

Я до сих пор не понял, как заставить работать эффекты материализации wave.js.

person test user please ignore    schedule 29.09.2018