Material-Design 组件是一款流行的前端框架，它基于谷歌的 Material Design 设计语言，包含了各种各样的 UI 组件，可以用来构建美观且易于使用的 Web 应用程序。最近，Material-Design 组件团队发布了一系列的更新和新功能，这些更新将进一步提高工作效率，并改善开发者的工作流。
新增组件及功能
Bottom Navigation
Bottom Navigation 是一个类似于选项卡的组件，它通常位于屏幕的底部，并为用户提供了一组快速访问页面的选项。新添加的 Bottom Navigation 组件允许你在一个页面上添加多个菜单项，而无需创建新的页面。这个组件非常适合需要在单个页面上展示大量内容的应用程序。
<mdc-bottom-navigation> <mdc-bottom-navigation-item icon="home" label="Home"></mdc-bottom-navigation-item> <mdc-bottom-navigation-item icon="favorite" label="Favorites"></mdc-bottom-navigation-item> <mdc-bottom-navigation-item icon="settings" label="Settings"></mdc-bottom-navigation-item> </mdc-bottom-navigation>
Dialogs
Dialogs 是一种弹出式窗口，可以用来展示一些关键信息、操作确认和提示给用户。现在，Dialogs 可以与其他 Material-Design 组件一起使用，如表单控件和按钮等。
<mdc-dialog>
<mdc-dialog-title>Delete item?</mdc-dialog-title>
<mdc-dialog-content>Do you really want to delete this item?</mdc-dialog-content>
<mdc-dialog-actions>
<mdc-button slot="secondaryAction">Cancel</mdc-button>
<mdc-button slot="primaryAction">Delete</mdc-button>
</mdc-dialog-actions>
</mdc-dialog>Toggle Buttons
Toggle Buttons 是一组可以切换状态的按钮，类似于复选框或单选按钮，但不同的是，Toggle Buttons 可以具有更大的自由度，可以有更多的不同状态。现在，Toggle Buttons 成为了一个独立的组件，你可以简单地将其添加到你的应用程序中。
-- -------------------- ---- ------- ------------------ ----------- ----- ------------ -------------- --------------------- ------------------------- ----------------- ----- ------------------- ----- ---------------------
提升工作效率的更新
除了新增组件和功能，Material-Design 组件还添加了一些针对开发者的更新和改进。这些更新旨在提高工作效率，减少你需要处理的琐碎任务。以下是一些值得注意的更新：
Rollup 支持
Material-Design 组件现在支持 Rollup，这让你可以轻松地使用 Rollup 打包工具来构建你的应用程序。
TypeScript 类型定义
如果你的应用程序使用 TypeScript，你会非常高兴地发现，Material-Design 组件现在具有完整的 TypeScript 类型定义，这将帮助你在编码期间捕获许多错误。
改进文档和工具
Material-Design 组件的文档和工具也得到了改进和更新。现在，你可以轻松地找到你需要的文档和示例，以及与其他开发者交流和分享经验。
学习和指导意义
Material-Design 组件是一种现代化的 UI 框架，它可以帮助你构建可重用的、易于维护的 Web 应用程序。这些新增的组件和功能，以及提升工作效率的更新，为开发者提供了更多的选择和自由度，可以大大减少编写重复代码的工作。你可以跟随 Material-Design 组件的官方文档，尝试并学习这些新的更新，以便更好地理解这些组件，并在你的项目中应用它们。
总结
Material-Design 组件一直是一款受欢迎的前端框架，它的更新和新功能进一步提高了工作效率，帮助开发者更加轻松地构建 Web 应用程序。新增的组件和功能可以为你的项目带来更多的自由和选择，而提升工作效率的更新可以让你更快地完成需要完成的工作。如果你还没有尝试过 Material-Design 组件，现在是一个不错的机会，让你的 Web 应用程序变得更加美观、易于使用和易于维护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64867e8248841e989450d184