Не удается настроить одновременную работу переключателей MDCRipple и MDCS над разными html-файлами. - PullRequest
0 голосов
/ 10 июля 2019

MDC Ripple effect и MDC Switches работают только тогда, когда оба на одном и том же HTML, а не на разных, я выделил стили и все остальное, и я думаю, что это что-то в дизайне материала app.js это то, как выглядит мой app.js:

import {MDCRipple} from '@material/ripple';

const buttonRipple = new MDCRipple(document.querySelector('.mdc-button'));

import {MDCSwitch} from '@material/switch';

const switchControl = new MDCSwitch(document.querySelector('.mdc-switch'));

(only the top one seems to work when I put switch HTML and the button HTML in different HTML pages.)

what the html looks like when they are both together:

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="bundle.css">
  </head>
  <body>
    <button class="mdc-button">
      <span class="mdc-button__label">Button</span>
    </button>

    <div class="mdc-switch">
      <div class="mdc-switch__track"></div>
      <div class="mdc-switch__thumb-underlay">
        <div class="mdc-switch__thumb">
            <input type="checkbox" id="basic-switch" class="mdc-switch__native-control" role="switch">
        </div>
      </div>
    </div>
    <label for="basic-switch">off/on</label>
    <script src="bundle.js" async></script>
  </body>
</html>

bundle.css и bundle.js создаются каждый раз webpack.config.js.Ожидается, что оба переключателя будут работать и пульсации в кнопках, работающих на отдельных HTML-страницах.

...