小程序开发学习-1-使用uni-app框架开发微信小程序

使用uni-app框架开发微信小程序

• 优势：

  • 同一套代码编译多端（Android、IOS、H5、小程序）
  • 接近原生系统，效率更好
  • 利用Hbuiler X，开发效率高，内存占用少
  • 开发（人力、维护、时间）成本低
  • 学过Vue之后，学习成本很低
  • 支持npm与自定义组件
  • 社区活跃，版本迭代快

页面的生命周期

onLoad() {
   
    console.log('页面加载')
},
onShow() {
   
    console.log('页面显示')
},
onReady() {
   
    console.log('页面初次渲染完成')
},
onHide() {
   
    console.log('页面隐藏')
},
onUnload() {
   
    console.log('页面关闭')
},
onShareAppMessage() {
   
    console.log('页面分享')
},
onPageScroll() {
   
    console.log('页面滚动')
},
onBackPress() {
      // 不支持小程序，通常写在onLoad中
    console.log('页面返回')
},

项目实战

tabBar

• 配置在page.json中

	"tabBar":{
   		
		"color":"#8F8F94",		
		"selectedColor":"#007AFF",		
		"backgroundColor":"#FFFFFF",
		"borderStyle":"black",		 		
		"list":[			
			{
   				
				"pagePath":