1.定义组件
在根目录下新建components来放置不同功能的组件
例:新建头部功能组件NavHeaders文件夹,然后在这个文件夹上右键新建component
新建完的组件文件如下:
其中.wxml和用来放置需要复用的组件结构,.wxss用来放置组件样式,.js用来放置组件的一些数据相关的
例:
2.注册组件
在哪个页面中使用组件,就要去哪个页面的.json文件中注册组件,如去index页面中使用组件,index.json中注册组件代码如下,key是组件自定义名字,value是组件的路径
{"usingComponents": {"NavHeader":"/components/NavHeaders/NavHeader"}}
3.使用组件
例:在index.wxml中使用组件
<NavHeader></NavHeader>
4.动态组件数据
在组件的.JS文件中的properties(相当于vue中的props)进行配置,如下,用type声明数据类型,用value声明传递的值
5.传递动态数据
<NavHeader title="推荐歌曲" nav="为你精心推荐"></NavHeader>