# slash-layer

**Repository Path**: lanmushan/slash-layer

## Basic Information

- **Project Name**: slash-layer
- **Description**: SlashLayer是一个基于Vue3开发的专注于解决业务后台管理系统复杂弹出框和表单问题的轻量级弹出层插件，致力于使用最少的代码完成更多的功能，将更多的时间用于摸鱼事业。提供常见的新增、更新等表单弹出层容器，图片预览、展示框容器、确认框等常用的基础功能，基于MIT协议，无任何使用限制。
- **Primary Language**: TypeScript
- **License**: MIT
- **Default Branch**: 1.1.x
- **Homepage**: https://layer.lanmushan.site/#/
- **GVP Project**: No

## Statistics

- **Stars**: 55
- **Forks**: 1
- **Created**: 2022-01-29
- **Last Updated**: 2025-07-21

## Categories & Tags

**Categories**: vue-extensions

**Tags**: vue3, Layer, 弹出框, 模态框, 图片查看器

## README

## 插件简介

基于VUE开发的模态框插件，支持常见的表单快速提交和图片预览等功能

## 项目特点

1. 为了快速开发后台管理系统
2. 后期适配移动端和指令式弹框

### 安装

```shell
npm install slash-layer
yarn add slash-layer
```

## 源码

[github](https://github.com/lanmushan/slash-layer)
[gitee](https://gitee.com/lanmushan/slash-layer)

## 开发指南

详细API文档请查看  
[API文档](./docs/doc.md)  
[文档](http://layer.lanmushan.site/)  
[示例](http://layerdemo.lanmushan.site/)

## 依赖

```json
{
  "core-js": "^3.6.5",
  "vue": "^3.0.0",
  "axios": "^0.26.0",
  "less-loader": "^7.3.0",
  "@typescript-eslint/eslint-plugin": "^5.10.1",
  "@typescript-eslint/parser": "^5.10.1",
  "@vue/cli-plugin-babel": "^4.5.15",
  "@vue/cli-plugin-typescript": "^4.5.15",
  "@vue/cli-service": "~4.5.0",
  "@vue/compiler-sfc": "^3.2.29",
  "@vue/eslint-config-typescript": "^10.0.0",
  "babel-eslint": "^10.1.0",
  "docsify-cli": "^4.4.3",
  "eslint": "^8.7.0",
  "eslint-plugin-vue": "^8.4.0",
  "less": "^4.1.2",
  "typescript": "~4.5.5"
}
```

## 部分功能预览效果

![img](https://lmscms.oss-cn-beijing.aliyuncs.com/slash-layer/images/img.png)
![img](https://lmscms.oss-cn-beijing.aliyuncs.com/slash-layer/images/demo.png)
![img](https://lmscms.oss-cn-beijing.aliyuncs.com/slash-layer/images/form.png)