3.小程序要点

1.事件
    <text class="moto" catchtap="onTextTap">开启小程序之旅</text>
    <text class="moto" bindtap="onTextTap">开启小程序之旅</text>


    catchtap 与 bindtap, catchtap不向上冒泡


2.页面引入数据
第一个页面：


var local_database = {}  //定义变量
module.exports = {  // 导入
    postList: local_database
}


第二个页面：
var postsData = require('../../data/posts-data.js');


3.data 设置方式
Page({
    data:{
        // 小程序总会读取 data 对象来做数据绑定，这个动作我们称为 A
        // 而这个动作 A 的执行，是在onLoad 事件之后发生的
    },
    onLoad: function(){
    //可以在onLoad 中有2种方式设置data
    //在 onLoad 中执行异步操作，在这个异步操作中，直接赋值是无效的, 必须调用 this.setData()
    1. this.data.属性 = 值 //直接赋值
    2. this.setData({}) // 更新
    }
})




4.xs:for="{{}}" wx:for-item="item" wx:for-index="idx"


5.template 模板的使用
1.模板定义
<template name="postItem">
    <view class="post-container">
        <view class="post-author-date">
            <image class="post-author" src="{{item.avatar}}"></image>
            <text class="post-date">{{item.date + " hello"}}</text>
        </view>
        <text class="post-title">{{item.title}}</text>
        <image class="post-image" src="{{item.imgSrc}}"></image>
        <text class="post-content">{{item.content}}</text>
        <view class="post-like">
            <image class="post-like-image" src="/images/icon/chat.png"></image>
            <text class="post-like-font">{{item.reading}}</text>
            <image class="post-like-image" src="/images/icon/view.png"></image>
            <text class="post-like-font">{{item.collection}}</text>
        </view>
    </view>
</template>


2.引入模板
<import src="post-item/post-item-template.wxml"/>


3.使用模板
<template is="postItem" data="{{item}}"/>


4.引入 css 

@import "post-item/post-item-template.wxss

5.平铺对象,直接写变量名就可以
    <template is="postItem" data="{{...item}}"/>


6.自定义数据
    <view catchtap="onPostTap" data-postID="{{item.postId}}" data-post-name="name"
    横线转驼峰，其他一律小写
    data-postID => postid

    data-post-name => postName

7.设置本地缓存
ws.setStorageSync(key,value); // 同步
ws.setStorage(key,value); // 异步


wx.getStorageSync("key") // 获取缓存
wx.removeStorageSync("key") // 清楚指定缓存
    wx.clearStorageSync()  //清楚所有缓存


8.wx.showModal，wx.showToast 
区别: showToast 会自动消失

  showModal 不会自动消失,需要用户确认

9.音乐播放
wx.playBackgroundAudio() // 播放
wx.pauseBackgroundAudio()  // 暂停


10.全局变量
app.js
// 设置
App({
    globalData: {
        g_isPlayMusic:false
    },
})
//获取

var app = getApp();

11.target 和 currentTaget 的区别 :

target 当前点击的组件 和 currentTaget 指的是事件捕获的组件