微信小程序入门（二） 引入自定义组件

一 业务场景

当有多个页面有相同的内容，这个时候，我们最好把这部分抽出来，抽成一个组件，增加代码复用性；这样做还有一个好处：如果一个页面的内容很多，将部分功能用组件代替，页面显得干净，一目了然；

二 实例

• 介绍组件

 

项目目录中有个components目录，这里放我们自定义组件

 

这里我定义了一个 bigCustomer组件

 

 

properties中的变量是，页面传来的值，类型有很多，Number,Object,String,Boolean 等等

• 引用组件

 

ballCheck页面要引用 bigCustomer组件，在ballCheck.json中这样写（不过要注意，写法规范，不然会报错）

{
  "usingComponents": {  
      "bigCustomer":"/components/bigCustomer/bigCustomer"
  }
}

 

ballCheck.wxml调用

<bigCustomer  cardList="cardList" bind:price="getLatestPrice"/>

ballCheck.wxml向bigCustomer传了cardList参数，并且绑定了函数（见微信程序（四）通信分类，有详细介绍，保证你会用）

 

三 总结

好了，基本就是这样使用，注意拼写，不然console会报错：找不打某某组件！