小程序学习_1

episode 1

微信小程序入门知识点

1.app.json/....wxml/....wxss/...js

.json 是对于页面基本属性的配置（window，tabbar等）

{
  "pages":[
    "pages/index/index",
    "pages/logs/logs",
    "pages/mytest/mytest",
    "pages/transaction/transaction"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle":"black",
    "enablePullDoneRefresh":true
  },
  "tabBar": {
    "color": "#000",
    "selectedColor": "#56abe4",
    "backgroundColor": "#fff",
    "borderStyle": "white",
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "首页",
        "iconPath": "images/latest.png",
        "selectedIconPath": "images/lastest_on.png"
      },
      {
        "pagePath": "pages/logs/logs",
        "text": "回款",
        "iconPath": "images/hotest.png",
        "selectedIconPath": "images/hotest_on.png"
      },
      {
        "pagePath": "pages/transaction/transaction",
        "text": "我的",
        "iconPath": "images/hotest.png",
        "selectedIconPath": "images/hotest_on.png"
      }
    ]
  },
  "debuge":true
}

在这个部分不允许有注释。

2.js 毋庸多说，JavaScript该干嘛干嘛，这里听老师说是只运用到了核心功能。

3....wxml——>html文件

4.....wxss——>css文件

以上是微信小程序的结构说明。接下来就是零散知识点。

js：Page（{}）

需要在json中注册页面；

在单个page下的json，wxss均覆盖app的对应文件。

java中业务分离的思想也在小程序的编程中体现出来了：

js中：

// pages/transaction/transaction.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    btndefa:"第一个按钮",
    btnprim:"第二个按钮",
    textinform:"original content"
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
  
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
  
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
  
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
  
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
  
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
  
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
  
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
  
  },
  primar:function(){
    console.log("第二个按钮被点击"),
    this.setData({textinform:"内容又没了"});
  }
})

{数据绑定}data中定义数据，之后是函数。【在wxml中应运的时候采用 content：{{subject}}】

今天观察到老师一个错误的习惯：var parameter=    content：.......

再者，冒泡事件和非冒泡事件，及其关联的bind和catch

冒泡就是石头往下扔泡泡往上翻，代表顺带执行其他函数。

渲染：wx：if={{}}

          wx：else

          wx:for="[....,....,.....,.......]"

子元素定死为item

include，import（template）【import无接力性质】