微信小程序开发(一)(共6页)_第1页
微信小程序开发(一)(共6页)_第2页
微信小程序开发(一)(共6页)_第3页
微信小程序开发(一)(共6页)_第4页
微信小程序开发(一)(共6页)_第5页
已阅读5页,还剩1页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1、精选优质文档-倾情为你奉上“微信”小程序开发(一)第一章 开发步骤第1节:小程序构成APP.JSONAPP.JSAPP.WXSS调用函数定义娈量引用接口组成页面窗口参数公共样式第2节:APP.JSON结构 "pages": "pages/index/index", "pages/logs/logs" , "window": "backgroundTextStyle":"light", "navigationBarBackgroundColor": &quo

2、t;#fff", "navigationBarTitleText": "WeChat", "navigationBarTextStyle":"black" Pages:小程序组成页面;Windows:窗口样式设定.第3节:APP.JS结构:App( onLaunch: function () var logs = wx.getStorageSync('logs') | logs.unshift(Date.now() wx.setStorageSync('logs', log

3、s) , getUserInfo:function(cb) var that = this; if(this.globalData.userInfo) typeof cb = "function" && cb(this.globalData.userInfo) else wx.login( success: function () wx.getUserInfo( success: function (res) that.globalData.userInfo = res.userInfo; typeof cb = "function" &

4、amp;& cb(that.globalData.userInfo) ) ); , globalData: userInfo:null )第4节:APP.WXSS结构.container height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 200rpx 0; box-sizing: border-box;第5节:页面结构1.页面文件资源结构Page_name.jsonPage_name.wxmlPage_nam

5、e.jsPage_name.wxss页面配置文件页面主文件页面JS文件页面样式文件2.页面配置文件:page_name.json页面的配置文件是非必要的。当有页面的配置文件时,配置项在该页面会覆盖 app.json 的 window 中相同的配置项。如果没有指定的页面配置文件,则在该页面直接使用 app.json 中的默认配置。3.页面主文件:page_name.wxml<view class="container"> <view bindtap="bindViewTap" class="userinfo">

6、<imageclass="userinfo-avatar"src="userInfo.avatarUrl" background-size="cover"></image> <text class="userinfo-nickname">userInfo.nickName</text> </view> <view class="usermotto"> <text class="user-motto"

7、>motto</text> </view></view>4.页面JS文件:page_name.jsvar app = getApp()Page( data: motto: 'Hello World', userInfo: , bindViewTap: function() wx.navigateTo(url: './logs/logs)' , onLoad: function () var that = this app.getUserInfo(function(userInfo) that.setData( userInfo:userInfo ) ) )5.页面样式文件:page_name.wxss.userinfo display: flex; flex-direction: column; align-items: center;.userinfo-avatar width: 128rpx; height: 128rpx; margin: 20rpx; bo

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论