Vusui-app-layer

前言

Vusui-app-layer 是一个基于 uni-app 的弹层组件库。插件市场版本如果和更新日志不一样，请移步 Github 下载。有组件需求或者 Bug 提交也可以移步到 issues。

特别说明

• Vusui-app-layer 是一个非原生的组件库，是无法覆盖原生 tabBar导航栏 与 navigationBar标题栏的。所以，有这方面问题的童鞋请先了解 uni-app 或者小程序相关组件和API文档。
• Vusui-app-layer 组件库使用的是 HX 2.4 以上版本开发的，在APP、H5、小程序上测试是没有问题的，低版本的 HX、小程序和浏览器不保证能正常使用。

API 文档手册

查看API文档

在线演示

用微信扫描下方二维码打开 Vusui-app 微信小程序，在组件栏点击弹层在线体验 Vusui-app-layer 组件。

开始使用

方法一： npm 安装

$ npm i -S vusui-app-layer

在 main.js 中写入以下内容。（注：Vusui-app-layer 使用到 Vuex 状态管理模式，所以，需要安装引入 Vuex。）

import Vue from 'vue';
import App from './App.vue';

// 第一步：引入 Vuex
import Vuex from 'vuex';
Vue.use(Vuex);

// 第二步：引入 Vusui-app-layer 弹层
import vusLayer from 'vusui-app-layer';
Vue.use(vusLayer);

// 第三步：new Vuex.Store()
const store = new Vuex.Store();
const app = new Vue({
    store,
    ...App
})
app.$mount()

第四步（重要）：在需要用到 Vusui-app-layer 弹层组件的页面写入 vus-layer 组件。

<template>
    <view>
        <vus-layer></vus-layer>
    </view>
</template>

<script>
export default {
    data() {
        return {}
    },
    methods: {
        openAlert() {
            this.vusui.alert('你现在可以使用vusui-app-layer了');
        }
    }
}
</script>

方法二：Git仓库 或者 uni-app 插件市场下载源码解压，复制 Vusui-app-layer 目录到你指定的目录。

在 main.js 中写入以下内容。（注：Vusui-app-layer 使用到 Vuex 状态管理模式，所以，需要安装引入 Vuex。）

import Vue from 'vue';
import App from './App.vue';

// 第一步：请参考方法一

// 第二步：引入 Vusui-app-layer 弹层
import vusLayer from './components/vusui-app-layer'; //vusui-app-layer 的存放目录
Vue.use(vusLayer);

// 第三步、第四步：请参考方法一

更新日志

• 2020年03月09日 v1.0.6

  • 增加 npm 安装功能
  • 修改引入方式：
    • 1：import vusLayer from './vusui-app-layer';
    • 2：Vus.use(vusLayer);

• 2020年01月11日 v1.0.5

  • 删除 css svg 动画，改为 image 动画。

• 2020年01月06日 v1.0.4

  • 增加 tabBar 属性，设置可控显示或隐藏 tabBar 导航栏
  • 优化 vusui-layer.vue
  • 优化 css 动画等

• 2020年01月05日 v1.0.3

  • 新增 page 页面层
  • 新增 photos 图集层
  • 修改 load 加载层动画效果
  • 优化弹层动画

• 2020年01月03日 v1.0.2

  • 修复关闭层时 showTabBar() 导致不正确的BUG

• 2020年01月03日 v1.0.1

  • 增加 hideTabBar() 和 showTabBar() 来显示/隐藏原生tabBar功能

• 2019年12月30日 v1.0

  • 发布第一个版本

License

MIT

Copyright (c) 2017-present, VusUI