微信小程序第一课

Page({  data:{                      //这个data是初始化变量    text : "这里是内容",     btnText : "这是按钮的内容",     show : true,  },  onLoad:function(options){    // 页面初始化 options为页面跳转所带来的参数  },  onReady:function(){    // 页面渲染完成  },  onShow:function(){    // 页面显示  },  onHide:function(){    // 页面隐藏  },  onUnload:function(){    // 页面关闭  },  btnClick : function (){//这里定义了一个函数      console.log("按钮被点击了")      var isShow = this.data.show;  //这个isShow就是那个data里面的show变量      console.log("isShow:"+isShow)//打印日志 //每次调用这个btnClick函数就会给text，show重新赋值      this.setData({text:"这是一个新的内容...",show:!isShow })  }})

first.xml文件

<include src="../templates/header" />jikexueyuan demo ..<button type="default"  hover-class="other-button-hover"> default </button><button type="primary" bindtap="btnClick"> {{btnText}} </button><view  wx:if="{{show}}" >{{text}} </view>   <!-- show的值为true的时候text的值会显示，否则就不显示-->   

判断标签

<view wx:if="{{show}}" >{{text}} 1</view>   <!-- show的值为true的时候text的值会显示，否则就不显示--> <view wx:else="{{show}} "> {{text}} 2 </view>

循环标签

先在first.sj  里面的Page   的data属性  定义数组news['aaa','bbb','ccc']

first.xml 里面写上循环标签

 <view wx:for="{{news}}">{{item}}</view>

循环标签这样写 根规范   前面有索引

 <view wx:for="{{news}}"  wx:for-item="itemx"> {{index}}-- {{itemx}} </view>

每调用一次这个函数就删除数组里面的一个值

  btnClick : function (){//这里定义了一个函数      console.log("按钮被点击了")      var isShow = this.data.show;  //这个isShow就是那个data里面的show变量      console.log("isShow:"+isShow)//打印日志      var newsDates=this.data.news;      newsDates.shift();//每调用这个函数就删除数组的一个值 //每次调用这个btnClick函数就会给text，show重新赋值      this.setData({text:"这是一个新的内容...",show:!isShow,news:newsDates })  }

引入一个头部底部文件，当多个页面都需要相同的文件时

底部文件模板有多个，这里用的是import   顶部文件就一个 。用的include 暂时不知道为什么

<template name="footer1">这是底部内容1  - {{text}}</template><template name="footer2">这是底部内容2  - {{text}}</template>

==============================================================================================================================

动态给模板赋值

<import src="../templates/footer"/><template is="footer2"    data="{{text:'导入设置的内容.....'}}"/> <!--动态给模板赋值-->

<template name="footer1">这是底部内容1  - {{text}}</template><template name="footer2">这是底部内容2  - {{text}}</template>

==================================================================微信小程序事件============================================

catchtap和bindtap的区别

<view class="view1"  id="view1"    bindtap="view1Click" >  view1  <view class="view2" id="view2"   bindtap="view2Click">    view2    <view class="view3"  id="view3"  catchtap="view3Click">   <!--catchtap和bindtap的区别，bidtap在第一层的时候，下面的两层也会触发事件，而catchtap只会触发这一层的事件，下面的事件不会触发-->      view3    </view>  </view></view>

---------------------------------------------------------------------------------------------------

事件的对象

。类型type

事件戳  timeStamp事件原组件 target

当前组件 currentTarget

触摸事件 touches

=================================================微信小程序的配置详解======================================================

app的页面配置

app的窗口配置

app的tabBar配置

网络超时配置及deBug开启配置

页面配置