2021-09-27 11:27:36 +08:00
|
|
|
<p align="center">
|
2021-12-23 00:37:57 +08:00
|
|
|
<a href="http://www.layui.com">
|
|
|
|
<img src="https://images.gitee.com/uploads/images/2021/1213/173638_d6911839_4835367.png" alt="layui" width="360">
|
2021-09-27 11:27:36 +08:00
|
|
|
</a>
|
|
|
|
</p>
|
2021-12-23 00:16:42 +08:00
|
|
|
|
2021-09-27 11:27:36 +08:00
|
|
|
<p align="center">
|
2021-09-30 02:54:39 +08:00
|
|
|
A component library for Vue 3 base on layui
|
2021-09-27 11:27:36 +08:00
|
|
|
</p>
|
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
<p align="center">
|
|
|
|
基 于 vue 3.0 的 组 件 库 桌 面 级 , layui 的 另 一 种 呈 现 方 式
|
|
|
|
</p>
|
|
|
|
|
2021-09-27 11:27:36 +08:00
|
|
|
<p align="center">
|
2021-10-07 02:12:16 +08:00
|
|
|
<a href="https://www.npmjs.com/package/@layui/layui-vue"><img src="https://img.shields.io/npm/v/@layui/layui-vue.svg?sanitize=true" alt="Version"></a>
|
2021-09-27 11:27:36 +08:00
|
|
|
<a href="https://www.npmjs.com/package/layui"><img src="https://img.shields.io/npm/l/layui.svg?sanitize=true" alt="License"></a>
|
|
|
|
<a href="https://travis-ci.org/sentsin/layui"><img alt="Build Status" src="https://img.shields.io/travis/sentsin/layui/master.svg"></a>
|
|
|
|
<a href="https://coveralls.io/r/sentsin/layui?branch=master"><img alt="Test Coverage" src="https://img.shields.io/coveralls/sentsin/layui/master.svg"></a>
|
2021-12-23 00:37:57 +08:00
|
|
|
<!--<a href="https://saucelabs.com/beta/builds/7e6196205e4f492496203388fc003b65"><img src="https://saucelabs.com/buildstatus/layui" alt="Build Status"></a>-->
|
2021-09-27 11:27:36 +08:00
|
|
|
</p>
|
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
<!--
|
|
|
|
<p align="center">
|
|
|
|
<a href="https://saucelabs.com/beta/builds/7e6196205e4f492496203388fc003b65"><img src="https://saucelabs.com/browser-matrix/layui.svg" alt="Browser Matrix"></a>
|
|
|
|
</p>
|
|
|
|
-->
|
2021-09-30 13:41:31 +08:00
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
---
|
2021-12-23 00:35:08 +08:00
|
|
|
|
2021-12-23 00:38:58 +08:00
|
|
|
### 快速上手 : Beta
|
2021-09-27 11:27:36 +08:00
|
|
|
|
2021-12-23 00:16:42 +08:00
|
|
|
获得 layui-vue 你只需要使用 npm 引入 :
|
2021-09-27 11:27:36 +08:00
|
|
|
|
|
|
|
```
|
2021-09-29 14:21:02 +08:00
|
|
|
npm install @layui/layui-vue
|
2021-09-27 11:27:36 +08:00
|
|
|
```
|
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
在 main.ts 中:
|
2021-09-29 14:21:47 +08:00
|
|
|
|
|
|
|
```js
|
|
|
|
import { createApp } from 'vue'
|
2021-10-06 19:58:06 +08:00
|
|
|
import Layui from '@layui/layui-vue'
|
2021-11-28 18:53:42 +08:00
|
|
|
import '@layui/layui-vue/lib/index.css'
|
2021-09-29 14:21:47 +08:00
|
|
|
import App from './App.vue'
|
2021-09-27 11:27:36 +08:00
|
|
|
|
2021-10-12 11:30:07 +08:00
|
|
|
createApp(App).use(Layui).mount('#app')
|
2021-09-29 14:21:02 +08:00
|
|
|
```
|
2021-09-29 14:21:47 +08:00
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
接下来,你就可以使用 layui-vue 来开发你的应用 :
|
2021-09-29 14:21:47 +08:00
|
|
|
|
|
|
|
```html
|
2021-09-29 14:21:02 +08:00
|
|
|
<template>
|
2021-10-12 11:30:07 +08:00
|
|
|
<lay-layout>
|
|
|
|
<lay-header>
|
|
|
|
<lay-logo>Layui Admin</lay-logo>
|
|
|
|
</lay-header>
|
|
|
|
<lay-side></lay-side>
|
|
|
|
<lay-body>
|
|
|
|
<router-view></router-view>
|
|
|
|
</lay-body>
|
|
|
|
<lay-footer>pearadmin.com</lay-footer>
|
|
|
|
</lay-layout>
|
2021-09-29 14:21:02 +08:00
|
|
|
</template>
|
2021-09-27 11:27:36 +08:00
|
|
|
```
|
2021-10-12 11:30:07 +08:00
|
|
|
|
2021-12-23 00:39:45 +08:00
|
|
|
## [阅读文档](http://layui-vue.pearadmin.com/)
|
2021-12-23 00:37:57 +08:00
|
|
|
|
|
|
|
从现在开始,用另一种方式拥抱 layui, 继续化作你方寸屏幕前的亿万字节!
|
2021-09-27 11:27:36 +08:00
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
### 使用趋势
|
2021-09-29 23:04:50 +08:00
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
[![Giteye chart](https://images.gitee.com/uploads/images/2021/1222/233241_e13a5449_4835367.png)](https://giteye.net/chart/5ZQ67WWS)
|
2021-09-29 23:04:50 +08:00
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
### 贡献代码
|
2021-10-12 11:30:07 +08:00
|
|
|
|
|
|
|
> 大概是因为 layui - vue 让开发者变得更懒,所以贡献者才这么少?
|
2021-12-23 00:37:57 +08:00
|
|
|
> 好的,姑且就这样认为吧。
|
|
|
|
|
2021-12-23 00:40:43 +08:00
|
|
|
[![Giteye chart](https://chart.giteye.net/gitee/layui-vue/layui-vue/DBC9Z6HQ.png)](https://giteye.net/chart/DBC9Z6HQ)
|
2021-12-23 00:37:57 +08:00
|
|
|
|
|
|
|
## 交流群
|
2021-10-12 11:30:07 +08:00
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
![输入图片说明](https://images.gitee.com/uploads/images/2021/1008/090410_8b349271_4835367.png 'QQ图片20211008090242.png')
|
2021-09-27 11:27:36 +08:00
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
## 相关
|
2021-10-12 11:30:07 +08:00
|
|
|
|
2021-12-23 00:37:57 +08:00
|
|
|
[官网](http://layui-vue.pearadmin.com/)、[更新日志](http://layui-vue.pearadmin.com/zh-CN/guide/changelog)、[交流群](https://jq.qq.com/?_wv=1027&k=ffiUQgnE)
|