每个自定义组件由四个代码文件组成：

json 文件：用于放置一些最基本的组件配置。
wxml 文件：组件模版。
wxss 文件：组件的样式，只在组件内部节点上生效（这个文件是可选的）。
js 文件：组件的js代码，承载组件的主要逻辑。
这四个文件与编写一个页面时用到的四个文件非常类似，但也有区别。下面将介绍如何利用这四个文件编写一个简单的自定义组件。

1,现在json文件中声明这是一个组件

image.png

2，编写wxml

image.png

image.png

简单的 Component 构造器调用包含3个定义段： methods 中的方法可以用来包含组件的事件回调函数； data 是组件的内部数据，可以用 this.setData 方法来改变； properties 中声明这个组件的属性，上例中声明了 title 属性，这样，组件外部在使用组件时就可以指定这个属性的值。
4,编写css

image.png

image.png

6，在wxml中正式使用组件

image.png

image.png

7，效果：

image.png