微信小程序第二天

指令

1 wx:for 用于控制结构及渲染及结构一般循环的是对象和数组 wx：for 指向被循环的内容

<view wx:key="{{this}}"  wx:for="{{arr}}">{{index}}{{item}}</view>

wx:key 是为了提升性能

index 是数组或者对象中的索引 item是成员

2 wx：if 用于控制结构控制显隐用法与wx：for一致

路由或者页面跳转

页面分为2种在tabBar中的页面叫做tabBar页面

在pages中的页面叫普通页面

页面跳转也分2中形式一种是组件跳转相当于a标签一种是代码跳转相当于locahost.href = ""

组件跳转到普通页面

<navigator  url="/pages/second/second" open-type="navigateTo">跳转到第2页面</navigator>

url：表示目标页面的地址
open-type  目标页面的类型
        当前页面  onhide
        新页面   onload   onshow   onready

组件跳转到tabBar页面

<navigator  url="/pages/second/second" open-type="swichTab">跳转到第2页面</navigator>

url：表示目标页面的地址
open-type  目标页面的类型
       当前页面 onhide
       新页面    如果已经点过  那么执行onshow
                没有点过   onload   onshow    onready
组件重定向页面

<navigator  url="/pages/second/second" open-type="redirect">跳转到第2页面</navigator>

当前页面 onunload

新页面onload onshow onready

组件后退

<navigator  url="/pages/second/second" open-type="navigateBack">跳转到第2页面</navigator>

当前页面 onunload

新页面onshow

代码跳转到普通页面在对应得js中书写

url：目标路径

wx:navigateTo({

    url: "/pahes/third/third "

})

代码跳转到tabBar页面

wx:swichTab({

    url: "/pahes/third/third "

})

代码重定向

wx:redirect({

    url: "/pahes/third/third "

})

代码后退

wx:navigateBack（）

传递数据的三种方式

一全局中转 其实全局中转就是在全局中的App.js中设置一个方法而后在每个页面中的js文件中引入这个方法这就是全局中转

在全局App.js中

1App({ 
2  abc: {
3    title: "ickt"
4  }
5})

在每个单独页面的js文件中

var  APP = getApp（）；

得到的app是一个对象这个对象包括许多在每个单独页面中可以运用

二利用query传参 query是url中的一部分

首先在转换页面时

1wx.navigateTo({
2  url: "/pages/second/second?a=1&b=2&c=3"
})

然后在跳转到的页面中的js文件中的onLoad方法中获取携带的数据

1onLoad: function (options) { 
2  console.log(options);
}

三本地存储

在每个页面的js中的onload事件中设置存储方法

获取内容

wx.getSrorage({
    
    key: 存储时的key

    success:function(res){}
})

res是一个对象有data errMsg

设置内容

wx.setStorage({key:存储的key,    data: 存储的值})

移除一项

wx.removeStorage({
    
    key: 移除项的名称}
})

清除所有

wx.clearStorage();