javascript - mdc.snackbar.MDCSnackbar() 抛出 this2.root_.querySelector is not a function 错误

Question

我在一个角度组件中创建一个新的 MDCSnackbar 对象的行出现以下错误，如下所示：

let snackbar = new mdc.snackbar.MDCSnackbar(document.getElementsByClassName('mdc-snackbar')).

错误堆栈如下：

Uncaught TypeError: this2.root .querySelector is not a function
at getActionButton (material-components-web.js:3144)
at Object.registerActionClickHandler (material-components-web.js:3174)
at MDCSnackbarFoundation.init (material-components-web .js:8572)
在 MDCSnackbar.MDCComponent (material-components-web.js:587)
在新 MDCSnackbar (material-components-web.js:3123) 在:1:11

我有以下用于小吃店的 html 片段：

<div class="mdc-snackbar"
 aria-live="assertive"
 aria-atomic="true"
 aria-hidden="true">
 <div class="mdc-snackbar__text"></div>
 <div class="mdc-snackbar__action-wrapper">
     <button type="button" class="mdc-button mdc-snackbar__action-button">
     </button>
</div>

非常感谢我可能做错了什么的线索。

Answer 1

更改语句以new mdc.snackbar.MDCSnackbar(document.querySelector('.mdc-snackbar')解决它。

Answer 2

试试看：

var x = new mdc.snackbar.MDCSnackbar(document.querySelector('.mdc-snackbar'));
x.open();