2

使用材料组件，我试图弄清楚如何使用组件基础的方法。

例如，我有

<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

4

1 回答 1

1

查看文档，在 MDCLinearProgress 上，设置进度方法是一个属性设置器（这是一个在写入给定属性时调用的函数）。因此，它不是作为函数调用的，而是像这样（其中 myDiv 是指向您在问题中创建的 div 树的指针）：

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

希望这可以帮助！

于 2018-06-12T10:35:13.990 回答