我刚开始使用 javascript 导入以及 webpack 和 babel 等东西。因此，如果我的术语有误，我深表歉意。
我正在尝试让 Google 的 Material Design 与测试项目配合使用，但我似乎无法让它发挥作用。
CSS 工作起来很容易，但实例化却不太容易。
我有一个按钮只是为了确保它正常工作，并且我可以让它工作，只是没有顶部应用栏。
import {MDCTopAppBar} from '@material/top-app-bar';
import {MDCRipple} from '@material/ripple';
const buttonRipple = new MDCRipple(document.querySelector('.mdc-button'));
// Instantiation
const topAppBarElement = document.querySelector('.mdc-top-app-bar');
const topAppBar = new MDCTopAppBar(topAppBarElement);
<header class="mdc-top-app-bar mdc-top-app-bar--fixed">
<div class="mdc-top-app-bar__row">
<section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
<a href="#" class="material-icons mdc-top-app-bar__navigation-icon">menu</a>
<span class="mdc-top-app-bar__title">Project</span>
</section>
</div>
</header>
我的代码是直接从documentation复制过来的，但菜单图标下方有一条线，并且动画不显示。
有人能够让它发挥作用吗？ 如果是这样怎么办？
我知道我无法从 codepen 上的本地文件导入内容，但是 this is what my Top App Bar looks like
最佳答案
如果有人发现这个并想知道该怎么办。谷歌在其文档中使用的代码而不是 .
在他们的演示页面上，他们有正确的代码。
更改此:
<a href="#" class="material-icons mdc-top-app-bar__navigation-icon">menu</a>
进入此:
<button class="mdc-icon-button material-icons mdc-top-app-bar__navigation-icon">menu</button>
关于javascript - Material Design 顶部应用栏 Javascript 不工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57101605/