之前的小程序组件基本都是由template来完成的，但是在基础版本库的1.6.3之后，小程序提供了一个更加人性化的自定义组件（Component）。
下面我们以自定义一个展示列表为例，一步一步自定义一个列表展示组件。
首先创建一个目录components,然后创建一个名为list的组件：（包含list.js、list.json、list.wxml、list.wxss四个文件）
image.png
对于这四个文件的具体介绍可在官方文档查看。
在list.js中建立一个属性movies
image.png
然后在list.wxml页面中加入以下代码：
<view>
<block wx:for="{{movies}}" wx:key="*this">
<view class="movie">
{{item}}
</view>
</block>
</view>
在list.wxss页面中加入以下代码：
.movie {
color: red;
}
这样组件就开发完成了，最后就剩下引用组件。
我在pages下面新建页面dongman
image.png
首先给dongman.json中加入usingComponents
image.png
然后在dongman.js中定义movies数据：
data: {
movies: [1,2,3,4,5,6]
}
最后在dongman.wxml中引用组件：
<list movies="{{movies}}"></list>
最终结果：
image.png
