简单谈谈微信小程序
在结构和样式方面,小程序提供了一些常用的标签与控件,比如:
配置文件app.json
平级的还有一个app.js
文件,是小程序的脚本代码。我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量,在每个page
目录里的js
做当前页面的业务操作。但是小程序的页面的脚本逻辑是在JsCore
中运行,JsCore
是一个没有窗口对象的环境,所以不能在脚本中使用window
,也无法在脚本中操作组件,所以我们常用的zepto/jquery
等类库也是无法使用的。
另一个app.wxss
文件,这个是全局的样式,所有的页面都会调用到,每个项目目录下面的wxss
是局部样式文件,不会和其他目录产生污染,可以放心使用样式名。
他提供的WXSS
是一套样式语言,具有 CSS
大部分特性,可以看作一套简化版的css
。
同时为了更适合开发微信小程序,还对 CSS
进行了扩充以及修改,直接帮我们把适配的一部分工作都做了,比如他的rpx
,可以根据屏幕宽度进行自适应,规定屏幕宽为750rpx
。如在 iPhone6 上,屏幕宽度为375px
,共有750
个物理像素,则750rpx = 375px = 750物理像素
,1rpx = 0.5px = 1
物理像素。
在调用微信生态系统功能时,微信小程序提供了相应的api
,比如你要修改一个头像,可以使用wx.chooseImage
等
小程序的原生组件有哪些
以微信小程序为例,可以分成容器组件
、基础组件
、表单组件
、媒体组件
、开放能力组件
等
小程序的安卓版和ios版是怎么开发出来
小程序开发基于html
、css
、javascript
,与web
开发一样具有跨平台
特性,一次开发即可在安卓
和iOS
等平台访问,但与普通web开发不同,小程序运行环境并不是浏览器,而是依附于各自的软件App,如微信小程序必须在微信中访问,支付宝小程序必须在支付宝中访问等,小程序的开发流程也有所不同,需要经过申请小程序帐号、安装小程序开发者工具、配置项目、开发、调试、上线发布等过程方可完成
uni-app弹窗被覆盖怎么解决
如果弹窗被别的内容覆盖,且设置很大的z-index
也无法解决,这种情况多半是被一些如map
、video
、textarea
、canvas
等原生组件遮盖,因为原生组件层级高于前端组件,我们可以使用cover-view
组件解决
小程序生命周期
onReady
生命周期函数–监听页面初次渲染完成
onShow
生命周期函数–监听页面显示
onHide
生命周期函数–监听页面隐藏
onUnload
生命周期函数–监听页面卸载
onPullDownRefresh
页面相关事件处理函数–监听用户下拉动作
onReachBottom
页面上拉触底事件的处理函数
onShareAppMessage
用户点击右上角转发
onPageScroll
页面滚动触发事件的处理函数
onTabItemTap
当前是 tab 页时,点击 tab 时触发
小程序路由跳转
1.通过组件navigator
跳转,设置url
属性指定跳转的路径,设置open-type
属性指定跳转的类型(可选),open-type
的属性有 redirect
, switchTab
, navigateBack
// redirect 对应 API 中的 wx.redirect 方法
<navigator url="/page/redirect/redirect?title=redirect" open-type="redirect">在当前页打开</navigator>
// navigator 组件默认的 open-type 为 navigate
<navigator url="/page/navigate/navigate?title=navigate">跳转到新页面</navigator>
// switchTab 对应 API 中的 wx.switchTab 方法
<navigator url="/page/index/index" open-type="switchTab">切换 Tab</navigator>
// reLanch 对应 API 中的 wx.reLanch 方法
<navigator url="/page/redirect/redirect?title=redirect" open-type="redirect">//关闭所有页面,打开到应用内的某个页面
// navigateBack 对应 API 中的 wx.navigateBack 方法
<navigator url="/page/index/index" open-type="navigateBack">关闭当前页面,返回上一级页面或多级页面</navigator>
2.通过api跳转,wx.navigateTo()
, wx.navigateBack()
, wx.redirectTo()
, wx.switchTab()
, wx.reLanch()
wx