12-template的使用

一、template的好处:可复用性高

  1. template目录结构
    pages--->templates--->swiper-template、tabs-template...
  2. template的使用

首先定义模板:swiper-template.wxml(相当于vue中的子组件)


其次在即将使用模板的.wxml中(相当于父级)引入模板

//


//is对应模板中定义的name即可

但此时并不能正确显示,因为模板中用到的循环数据swiperList定义中在父级页面中,需要把传值到swiper-template.wxml中


//circular是swiper的一个属性,定义滑块循环滑动

️在data中可以传多个值,用逗号隔开即可
当然也可以把css放入到swiper-template.wxss,然后在父级页面的.wxss中引入

@import "/pages/templates/swiper-template/swiper-template.wxss";

同理:其他页面如果想用也可以上述一样的步骤引入swiper-template,然后传入相应的参数即可。

你可能感兴趣的:(12-template的使用)