微信小程序開發之向組件傳值的三種方式

一. 直接傳值

向組件custom-component傳值的頁面

<!--index.wxml-->
<custom-component my-value="hello" />

或者，可以是

<!--index.wxml-->
<custom-component myValue="hello" />

其中，設置了一個名爲my-value/myValue的屬性，這個屬性會直接傳給組件，但是，組件要先宣佈一個變量。myValue，無論組件的屬性名是設置爲“my-value”，還是"myValue"，最終接收變量名字都是myValue。所以，在組件js中

// pages/component/test.js
Component({
  /**   
  * 組件的屬性列表   
  */
 properties: {    
 	myValue: String  
 	},
  /**  
   * 組件的初始數據  
   */ 
  data: {
  	},
  /**   
  * 組件的方法列表   
  */  
  methods: {
  	}
  })

二. 數據綁定傳值

只需要改變設置屬性的方式即可

<!--index.wxml-->
<custom-component my-value={{helloValue}} />

三. 雙向數據綁定

這個方法數據改變的話，也會改變組件中屬性的值

<!--index.wxml-->
<custom-component model:my-value={{helloValue}} />