微信小程式涉及四種檔案：js\json\wxml\wxss 初次接觸這些，故而做個學習筆記，以便查閱（本文將持續更新，一些知識點來自網路，侵刪）

1. input 控制元件

<input class="new-quick" value="{{ todo }}" placeholder="快速新增..." 
bindinput="inputTodo" bindconfirm="addTodo" auto-focus />

bindinput和bindconfirm都可以理解為槽函式slot，顧名思義，當input控制元件捕獲到input時（比如鍵鼠輸入），呼叫inputTodo

value = {{todo}}，綁定了相應js檔案的todo資料，value顯示的是輸入框的初始內容，placeholder是輸入框為空時佔位符。比如當前是綁定了todo，但啟動初始，todo為空，因此，顯示的是 快速新增...。可參見微信input API釋義
若改成下面的方式：

<input class="new-quick" value="1234" placeholder="快速新增..." 
bindinput="inputTodo" bindconfirm="addTodo" auto-focus />
 

則啟動後，input框預設輸入就是 1234了

/***************************************************************************************************/

WXML小知識

1. input與textarea
   <input>是一個單行輸入框，有value屬性，但是它不能自動換行
   <textarea>是一個多行輸入框，沒有value屬性，但是它能自動換行

2. 在wx:for迴圈中，預設遍歷項為item，遍歷索引為名index，如果包含多重for迴圈，應該通過wx:for-item

   改變遍歷項預設名，如下：

<block>
  <view class='container' wx:for="{{twoList}}" wx:key = 'id'>
    <view>
      <switch disabled='false' bindchange='switchChange' 
      data-data-index='{{item.id}}'></switch>{{index+1}}、{{item.name}}
    </view>
    <view wx:for="{{item.twodata}}" wx:for-item="abt" >
      ----{{abt.name}}---{{item.name}}
    </view>
  </view>
  <button bindtap='clickedBTN'>新增選單</button>
</block>

line5與line8 {{item.name}} 都將呼叫同一個name，而line8{{abt.name}}，將呼叫前套內的name

/***************************************************************************************************/

JavaScript小知識

1. splice() 方法用於插入、刪除或替換陣列的元素。該方法會改變原始陣列
   用法

   array.splice(index,N,item1,…,itemX)

2. forEach與each、map函式辨析：
   類似C++，forEach 在JavaScript中也用於遍歷陣列，其用法如下：

var arr = [1,2,3,4];
arr.forEach(alert);

等價於

var arr = [1, 2, 3, 4];
for (var k = 0, length = arr.length; k < length; k++) {
 alert(array[k]);
}

forEach方法中的function回撥有三個引數：第一個引數是遍歷的陣列內容value，第二個引數是對應的陣列索引index，第三個引數是陣列本身array。因此，存在以下等式：array[index] = value
forEach一般用法：

[].forEach(function(value,index,array){
		//index和array是可以預設的
		//code something
　　});

each等價表達

$.each([],function(index,value,array){
 
　　　//code something
 
　})

示例：

var arr = [1,2,3,4];
var sum = 0；
arr.forEach(function(value,index,array){
    sum+=value;  
    });
console.log(sum);    //結果為 10

map與forEach類似，換作map可以這樣表達：

var arr = [1,2,3,4];
var sum = 0；
arr.map(function(value,index,array){
    sum+=value;  
    });
console.log(sum);    //結果為 10

/**********************************/

WXSS小知識

1. 相對畫素
   為適配不同尺寸螢幕，小程式提出相對畫素rpx的概念（原創性待考證哈），絕對畫素px就是實實在在佔用的畫素。rpx與px存在特定的換算關係，該關係由螢幕決定。
   小程式統一將介面劃分為750rpx，我們只需關注相對畫素佈局即可。
   比如 iPhone 6S下換算關係為 1rpx = 2px，
   重點！！！任何時候，指定畫素大小的時候，數值後要緊跟rpx，不要加空格。否則會呈現出你不期待的佈局（我用的版本是V1.02.1809111，可能微信後續會修復這個問題）

正確寫法

.avatar image {
	width: 200rpx;
	height:200rpx;
	border-radius:100rpx;
}

錯誤寫法

.avatar image {
	width: 200 rpx;
	height:200 rpx;
	border-radius:100 rpx;
}