uniapp

TabBar

uni.hideTabBar()
隐藏tab
uni.showTabBar()
显示tab

https://uniapp.dcloud.io/api/ui/tabbar?id=hidetabbar

系统信息

uni.getSystemInfo(OBJECT)

获取系统信息

statusBarHeight: 状态栏的高度
platform:客户端平台，值域为：ios、android、mac（3.1.10+）、windows（3.1.10+）、linux（3.1.10+）

手机是否是刘留海屏可以通过statusBarHeight判断，

刘海屏为44
全面屏为20

https://uniapp.dcloud.io/api/system/info?id=getsysteminfo

uni.getSystemInfoSync()

获取系统信息同步接口。
https://uniapp.dcloud.io/api/system/info?id=getsysteminfosync

图片预览

uni.previewImage(OBJECT)

imgMap(i, currentId) {
    uni.previewImage({
        current: currentId, // 图片索引
        urls: this.imageList[i], // 图片数组
    });
},

https://uniapp.dcloud.io/api/media/image?id=unipreviewimageobject

元素滚动到顶部固定悬浮

https://blog.csdn.net/u013338742/article/details/106750272/?utm_medium=distribute.wap_relevant.none-task-blog-2

Popup 弹出层

https://ext.dcloud.net.cn/plugin?id=329

生命周期函数

onLoad onShow

https://uniapp.dcloud.io/collocation/frame/lifecycle?id=%e5%ba%94%e7%94%a8%e7%94%9f%e5%91%bd%e5%91%a8%e6%9c%9f

获取页面

getApp() 函数用于获取当前应用实例，一般用于获取globalData 。
getCurrentPages() 获取当前页面栈的实例，以数组形式按栈的顺序给出，第一个元素为首页，最后一个元素为当前页面。
$getAppWebview()
https://uniapp.dcloud.io/collocation/frame/window?id=getapp

uniapp 页面跳转

uni.navigateTo({
    url: '/pages/info/index',
});

https://blog.csdn.net/zhuoganliwanjin/article/details/81781327

u-navbar 自定义导航栏

https://www.uviewui.com/components/navbar.html

u-sticky 吸顶

https://www.uviewui.com/components/sticky.html

swiper 轮播图

swiper实现轮播
https://uniapp.dcloud.io/component/swiper

scroll-view 滚动视图

// toView是data数据
// 可以写一个点击事件，修改toView值，就会滚动到对应id的view
// scroll() 是重置toView的值

scroll-into-view: 内容够多才有效果，可实现点击切换内容

可参考https://blog.csdn.net/liyi1009365545/article/details/89438743
https://uniapp.dcloud.io/component/scroll-view

rich-text 富文本

  hszz

https://uniapp.dcloud.io/component/rich-text
https://www.jianshu.com/p/a0e3b8b59049

客服按钮

// open-type='contact'  打开客服会话，如果用户在会话中点击消息卡片后返回应用，可以从 @contact 回调中获得具体信息
// send-message-title="客服" 会话内消息卡片标题，open-type="contact"时有效

https://uniapp.dcloud.io/component/button?id=button

图片组件 u-image/ image

mode: 图片裁剪、缩放的模式

scaleToFill: 不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素
aspectFit: 保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整地将图片显示出来。
aspectFill: 保持纵横比缩放图片，只保证图片的短边能完全显示出来。也就是说，图片通常只在水平或垂直方向是完整的，另一个方向将会发生截取。
widthFix: 宽度不变，高度自动变化，保持原图宽高比不变

https://uniapp.dcloud.io/component/image
https://www.uviewui.com/components/image.html

u-mask 遮罩层

//通过show参数配置是否显示遮罩
//遮罩被点击时，会发送一个click事件，如不需要此事件，请设置mask-click-able参数为false

https://www.uviewui.com/components/mask.html

uni.showModal 提示交互弹框

https://uniapp.dcloud.io/api/ui/prompt?id=showmodal

NumberBox 数字输入框

https://www.bookstack.cn/read/uniapp-component/4abbbae6afcb8f7b.md

uniapp设置缓存

uni.setStorage(OBJECT)
将数据存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个异步接口。

uni.setStorage({
    key: 'storage_key',
    data: 'hello',
    success: function () {
        console.log('success');
    }
})

uni.getStorage(OBJECT)
从本地缓存中异步获取指定 key 对应的内容。

uni.getStorage({
    key: 'storage_key',
    success: function (res) {
        console.log(res.data);
    }
});

https://uniapp.dcloud.io/api/storage/storage?id=setstorage

mescroll-uni 下拉刷新(插件市场组件)

// upCallback 下拉后上拉的触发事件

http://www.mescroll.com/uni.html
https://ext.dcloud.net.cn/plugin?id=4094#detail

Picker 选择器-时间/地点/性别

https://www.uviewui.com/components/picker.html