vusui-app-layer

1.0.6 • Public • Published

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

Package Sidebar

Install

npm i vusui-app-layer

Weekly Downloads

1

Version

1.0.6

License

ISC

Unpacked Size

63 kB

Total Files

15

Last publish

Collaborators

  • vusui