Инициализация материализуется в реагирующих приложениях - PullRequest
0 голосов
/ 27 декабря 2018

Я новичок в ReactJS.Поэтому у меня прямой вопрос.

Я использовал материализовать CDN, включенный в index.html.Но когда я пытаюсь инициализировать его в моем компоненте, он говорит, что «М» не определен.Где я должен инициализировать то же самое.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <meta name="theme-color" content="#000000" />
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css"
    />

    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
    <title>React App</title>
  </head>

  <body>
    <noscript> You need to enable JavaScript to run this app. </noscript>
    <div id="root"></div>
  </body>
</html>

Мой компонент выглядит примерно так

import React from "react";

class Dashboard extends React.Component {
  componentDidMount() {
    document.addEventListener("DOMContentLoaded", function() {
      var elems = document.querySelectorAll(".carousel");
      var instances = M.Carousel.init(elems, options);
    });
  }
}

export default Dashboard;

Ссылка CodeSandbox: - https://codesandbox.io/s/40jvz6j590

1 Ответ

0 голосов
/ 27 декабря 2018

Ну, если вы используете его, вам нужно его импортировать: D

import React from "react";
import {Carousel} from "react-materialize";

А вот как это использовать https://react -materialize.github.io / # / carousel

...