Как использовать веб-фонды компонентов материалов

Question

Используя Материальные Компоненты, я пытаюсь понять, как использовать методы Основ Компонентов.

Для примера у меня есть

<div role="progressbar" class="mdc-linear-progress">
  <div class="mdc-linear-progress__buffering-dots"></div>
  <div class="mdc-linear-progress__buffer"></div>
  <div class="mdc-linear-progress__bar mdc-linear-progress__primary-bar">
    <span class="mdc-linear-progress__bar-inner"></span>
  </div>
  <div class="mdc-linear-progress__bar mdc-linear-progress__secondary-bar">
    <span class="mdc-linear-progress__bar-inner"></span>
  </div>
</div>

и в моем JS у меня есть

const bar = $('.mdc-linear-progress')[0];

const MDCLinearProgress = mdc.linearProgress.MDCLinearProgress;
const MDCLinearProgressFoundation = mdc.linearProgress.MDCLinearProgressFoundation;

const progress = new MDCLinearProgress(bar);
const progressFoundation = new MDCLinearProgressFoundation(bar);

progressFoundation.setProgress(0.5);

как вы видите, моя цель состоит в том, чтобы пытаться использовать такие методы, как setProgress от MDCLinearProgressFoundation учебный класс. Хотя это не работает, и я не уверен относительно того, что я делаю неправильно, поскольку это также не дает никакой ошибки.

Codepen - https://codepen.io/ErraticFox/pen/LdwYxb

Answer 1

Глядя на документацию, в MDCLinearProgress, метод set progress является установщиком свойств (который вызывается при записи данного свойства). Как таковой, он не вызывается как функция, а как-то так (где myDiv - указатель на дерево div, которое вы создали в своем вопросе):

var mlp = new mdc.linearProgress.MDCLinearProcess(myDiv);
mlp.progress = 0.5;

Надеюсь это поможет!