2021-05-06

uniapp

uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS，Android，Web（响应式），以及各种小程序（微信/支付宝/百度/头条/ QQ /钉）钉/淘宝），快应用等多个平台。

通過HBuilderX可視化界面，也可以通過vue-cli創建uniapp

nvue和vue開發的常見區別

1.nvue 页面控制显隐只可以使用v-if不可以使用v-show
2.nvue 页面只能使用flex布局，不支持其他布局方式。页面开发前，首先想清楚这个页面的纵向内容有什么，哪些是要滚动的，然后每个纵向内容的横轴排布有什么，按 flex 布局设计好界面。
3.nvue 页面的布局排列方向默认为竖排（column），如需改变布局方向，可以在 manifest.json -> app-plus -> nvue -> flex-direction 节点下修改，仅在 uni-app 模式下生效。
4.文字内容，必须、只能在text组件下。不能在div、view的text区域里直接写文字。否则即使渲染了，也无法绑定js里的变量。
5.布局不能使用百分比、没有媒体查询。

uniapp页面生命周期

onInit ：监听页面初始化，其参数同 onl oad 参数，为上个页面传递的数据，参数类型为 Object（用于页面传参），触发时机早于 onl oad

onLoad ：监听页面加载，其参数为上个页面传递的数据，参数类型为 Object（用于页面传参）

onShow：监听页面显示。页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面

onReady：监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发

onHide：监听页面隐藏

onUnload：监听页面卸载

onResize：监听窗口尺寸变化

onPullDownRefresh：监听用户下拉动作，一般用于下拉刷新

onReachBottom ：页面滚动到底部的事件（不是scroll-view滚到底），常用于下拉下一页数据。具体见下方注意事项

标签：flex,nvue,06,05,onLoad,布局,2021,监听,页面
来源： https://blog.csdn.net/qq_48176716/article/details/116465742