小程序自定义模板 template

小程序自定义模板 template

自定义模板

myTemplate.wxml

//myTemplate
<template name="myTmp">
	<view class="title">
		<text>姓名：{{name}}</text>
		<text>年龄：{{age}}</text>
	</view>
</template>

myTemplate.wxss

.title{
	color:red
}

引用自定义模板的页面

myPage.wxml

<import src="myTemplate"/>
<view>测试</view>
<template is="myTmp" data="{{...item}}"></template>
<!--此处is的值需与自定义模板的name值相同 data是向自定义模板传数据-->

myPage.js

data:{
	item:{
		name:"张三"
		age: 15
	}
}

myPage.wxss

@import "myTemplate"
//只有引入自定义模板的wxss，自定义模板的样式才生效