# 微信小程序

严格来说,微信小程序支持所有的开发工具,但是从效率和便利性来说,推荐如下

微信自己的微信小程序开发工具 下载地址

1,全局的配置文件:
page:json文件不能有注释代码
window: (头部)
	navigationBarBackgroundColor:只能是支持16进制的颜色
    navigationBarTitleText:开头的标题
    navigationBarTextStyle:指的是字体的颜色(只能为white/black)  
        
        
tabBar:(导航)     *****list需要至少两个,最多五个
    "tabBar": {
    "list": [{---------->数组套对象
      "pagePath": "pagePath",(路径)
      "text": "text",(导航的文字)
      "iconPath": "iconPath",(图片)
      "selectedIconPath": "selectedIconPath"(确定图片)
    }]
        
tabBar:下的导航字体背景颜色,字体颜色,确定颜色,以及边框都可以设定
    "backgroundColor": "#fff000",
    "color": "#0066CC",
    "selectedColor": "#003399",
     "borderStyle": "black",且只能是 "white/black"

如果页面里面不是tabBar页面的话,它是没有导航栏的
另外也可以把不是tabBar页面单独拉出来,直接设定颜色
      
        
2,目录介绍    
1>index.js:写的就是js,页面的逻辑请求和后台数据,一些方法,动态方法,一些函数,事件,
2>page~json :代表的是单个页面的配置文件
3>wxml:其实就是html页面,微信子集封装好了
4>wxss:是一套样式语言,用于描述WXML的组件样式,和css相比,WxSS扩展的特性有(尺寸单位,样式导入)
utils:(公共的)
	app.js:整个小程序的启动文件(全局的js)
    app.json:这配置整个小程序的(全局的配置文件)
    app.wxss:小程序的公共样式(全局的样式文件)
    project.config.json:配置的小程序的版本(接口是2.0.4)
    sitemap.json:整个项目的描述文件   
      
视图层:
      <view><\view>---->相当于html的<div></div>
      

常见的事件有:

类型 触发条件 最低版本
touchstart 手指触摸动作开始
touchmove 手指触摸后移动
touchcancel 手指触摸动作被打断,如来电提醒,弹窗
touchend 手指触摸动作结束
tap 手指触摸后马上离开
longpress 手指触摸后,超过350ms再离开,如果指定了事件回调函数并触发了这个事件,tap事件将不被触发 1.5.0
longtap 手指触摸后,超过350ms再离开(推荐使用longpress事件代替)
transitionend 会在 WXSS transition 或 wx.createAnimation 动画结束后触发
animationstart 会在一个 WXSS animation 动画开始时触发
animationiteration 会在一个 WXSS animation 一次迭代结束时触发
animationend 会在一个 WXSS animation 动画完成时触发
touchforcechange 在支持 3D Touch 的 iPhone 设备,重按时会触发
  • 注意点:
    Touchcancle:在某些特定的场景下才会触发

    ​ tap事件和longpress事件通常只会触发其中一个

wx.request 相当于发送ajax的请求

微信官方解释

参数

属性 类型 默认值 必填 说明
url string 开发者服务器接口地址
data string/object/ArrayBuffer 请求的参数
header Object 设置请求的 header,header 中不能设置 Referer。content-type 默认为 application/json
method string GET HTTP 请求方法
dataType string json 返回的数据格式
responseType string text 响应的数据类型
success function 接口调用成功的回调函数
fail function 接口调用失败的回调函数
complete function 接口调用结束的回调函数(调用成功、失败都会执行

小程序路由跳转

### 1.1wx.switchTab(Object object)

**这里的tabBar是底下的导航栏指定的页面,**
跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面

### 1.2wx.reLaunch(Object object)

> 基础库 1.1.0 开始支持,低版本需做[兼容处理](https://developers.weixin.qq.com/miniprogram/dev/framework/compatibility.html)。

关闭所有页面,打开到应用内的某个页面

### 1.3wx.redirectTo(Object object)

关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。

### 1.4wx.navigateTo(Object object)

保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 [wx.navigateBack](https://developers.weixin.qq.com/miniprogram/dev/api/wx.navigateBack.html) 可以返回到原页面。小程序中页面栈最多十层。

### 1.5wx.redirectTo与wx.navigateTo的区别

***1.利用wx.navigateTo跳转到下一个页面的时候(这时候会执行onHide方法),下一个页面头部会有返回按钮***

***2.如果不想有返回按钮,可以用wx.redirectTo进行页面跳转(这时候关闭此页面,会执行onUnload生命周期,这样下一个页面就不会有返回按钮了,因为上一个页面已经被关闭了,没有页面可以返回)***

### 1.6wx.navigateBack(Object object)

关闭当前页面,返回上一页面或多级页面。可通过 [getCurrentPages()](https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/route.html#getcurrentpages) 获取当前的页面栈,决定需要返回几层。

posted @ 2019-09-24 19:09  enazede  阅读(285)  评论(0编辑  收藏  举报