npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

vusui-app-layer

v1.0.6

Published

Vusui-app-layer 是一个基于 uni-app 的弹层组件库。有组件需求或者 Bug 提交也可以移步到 issues。

Downloads

4

Readme

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