今天我们来学习微信小程序的更多内容。
- wxss（微信样式表）
1.微信的样式和css普通页面几乎也一样
2.微信里面的750rpx等于当前屏幕的宽
3.app.wxss样式是全局的
4.页面.wxss是只对当前页面有效
- 网络请求
wx.request
- 下拉刷新
1.onPullDownRefresh() // 业务逻辑刷新
2.wx.stopPullDownRefresh() // 停止下拉刷新
配置
1."backgroundColor":"#f30" // 下拉刷新背景颜色
2."backgroundTextStyle":"light" // 下拉刷新加载提示颜色 light/dark
3."enablePullDownRefresh":true // 允许下拉刷新
- 加载提示
1.wx.showLoading
2.wx.showToast
1).title 标题
2).icon 图标
3).duration 持续时间
- 数组方法
a.concat(b) 把a数组和b数组合并
- 本地存储
1.getStorage
1).key
2).success 成功
3).fail 失败
2.setStorage
1).key
2).value 不需要转字符串
- 页面间跳转
1.标签跳转 navigator
1.url跳转的地址 url="/pages/index/index"
2.open-type 跳转的类型
1).redirect 重定向（跳转过后页面没有返回箭头）不会留下历史记录（跳转过后不能通过返回到这个页面）
2).navigateBack 返回
2.代码跳转
// navigateTo
wx.navigateTo({
url:'/pages/index/index',
})
// redirectTo
wx.redirectTo({
url:'/pages/index/index',
})
3.tabs 底部栏
1.app.json 配置tabBar
2.navigator open-type="switchTab"
3.wx.switchTab({
url:'/pages/index/index',
})
4.页面传参
url="/pages/news/news?id=abc&age=18"
- 小程序的生命周期
1.onLoad 页面加载 ---获取页面的参数 options
2.onReady 页面渲染
3.onShow 页面显示
4.onHide 页面隐藏
5.onUnload 页面卸载 ---当重定向 redirect 该页面会被卸载
6.层级关系
A-B-C-D-E
当到达E页面时候ABCD都会被缓存起来 最多缓存5个页面
单击返回就会回到上一层页面
7.在缓存时，最多缓存5个，当用redirect 该页面不会被缓存
1).wx.navigateTo会增加页面栈大小，直到页面栈大小为5
2).wx.redirectTo不会增加页面栈大小
3).wx.navigateBack会增加页面栈大小，直到页面栈大小为1
- scroll-view 可滚动视图区域
scroll-x 允许横向滚动
scroll-left 设置横向滚动条位置 scroll-left="{{scrollLeft}}"
scroll-into-view 值应为某子元素id（id不能以数字开头）。设置哪个方向可滚动，则在哪个方向滚动到该元素
- swiper 滑块视图容器
autoplay 是否自动切换 autoplay="{{true}}"
indicator-dots 是否显示面板指示点 indicator-dots="{{true}}"
indicator-active-color 当前选中的指示点颜色 indicator-active-color="#f30"
interval 自动切换时间间隔
duration 滑动动画时长
- 地理位置
我们需要访问百度地图API，在控制台界面，创建应用，获取AK（访问应用），复制秘钥粘贴到项目中。具体操作步骤可以参考微信小程序JavaScript API文档，大家不妨试一试，真的很方便！
好了，今天的分享就到这里了！
愿你三冬暖，愿你春不寒；愿你天黑有灯，下雨有伞。
