在Vuetify和Vuex之上构建的精美的Material Design Admin资源

最新推荐文章于 2024-07-28 08:50:09 发布

cuk5239

最新推荐文章于 2024-07-28 08:50:09 发布

阅读量1.6k

点赞数

文章标签： java vue python 大数据 javascript ViewUI

原文链接：https://vuejsexamples.com/a-beautiful-material-design-admin-resource-built-over-vuetify-and-vuex/

版权

Vuetify材质仪表板 (Vuetify Material Dashboard)

Vuetify Material Dashboard is a beautiful resource built over Vuetify and Vuex. It will help you get started developing dashboards in no time. Vuetify Material Dashboard is the official Vuejs version of the Original Material Dashboard. Using the Dashboard is pretty simple but requires basic knowledge of Javascript, Vue, Vuex and Vue-Router.

Vuetify Material Dashboard是在Vuetify和Vuex的基础上构建的一种漂亮资源。它将帮助您立即开始开发仪表板。 Vuetify Material Dashboard是原始Material Dashboard的官方Vuejs版本。使用仪表板非常简单，但是需要Javascript，Vue，Vuex和Vue-Router的基础知识。

View demo 查看演示 Download Source 下载源

入门 (Getting Started)

Install Nodejs from Nodejs Official Page
从Node.js官方页面安装Node.js
Open your terminal
打开您的终端
Navigate to the project
导航到项目
Run npm install or yarn install if you use Yarn
如果使用Yarn， yarn install运行npm install或yarn install
Run npm run dev or yarn serve to start a local development server
运行npm run dev或yarn serve来启动本地开发服务器
A new tab will be opened in your browser
新的标签页将在您的浏览器中打开

You can also run additional npm tasks such as

您还可以运行其他npm任务，例如

npm run build to build your app for production
npm run build构建您的应用程序以进行生产
npm run lint to run linting.
npm run lint 。

威化 (Vuetify)

Vuetify is developed exactly according to Material Design spec. Every component is hand crafted to bring you the best possible UI tools to your next great app. The development doesn't stop at the core components outlined in Google's spec. Through the support of community members and sponsors, additional components will be designed and made available for everyone to enjoy.

Vuetify是完全根据材料设计规范开发的。每个组件都是手工制作的，可以为您的下一个出色应用带来最佳的UI工具。开发并不仅限于Google规范中概述的核心组件。在社区成员和赞助者的支持下，将设计其他组件并将其提供给所有人使用。

威克斯 (Vuex)

Vuex is a state management pattern + library for Vue.js applications. It serves as a centralized store for all the components in an application, with rules ensuring that the state can only be mutated in a predictable fashion. It also integrates with Vue's official devtools extension to provide advanced features such as zero-config time-travel debugging and state snapshot export / import.

Vuex是Vue.js应用程序的状态管理模式+库。它充当应用程序中所有组件的集中存储，其规则确保状态只能以可预测的方式进行更改。它还与Vue的官方devtools扩展集成，以提供高级功能，例如零配置时间旅行调试和状态快照导出/导入。

Vue-cli (Vue-cli)

We used the latest 3.x Vue CLI which aims to reduce project configuration to as little as possible. Almost everything is inside package.json + some other related files such as .babel.config.js, .eslintrc.js and .postcssrc.js.

我们使用了最新的3.x Vue CLI ，该CLI旨在将项目配置减少到最少。几乎所有内容都在package.json和其他一些相关文件中，例如.babel.config.js ， .eslintrc.js和.postcssrc.js 。

Let us know what you think and what we can improve below. And good luck with development!

让我们知道您的想法以及下面我们可以改进的地方。祝您发展顺利！

特别感谢 (Special thanks)

During the development of this dashboard, we have used many existing resources from awesome developers. We want to thank them for providing their tools open source:

在开发该仪表板的过程中，我们使用了许多出色的开发人员提供的现有资源。我们要感谢他们提供开源的工具：