微信小程序-WXML-template模板

微信小程序中的模板，可以在其中定义代码片段，然后再不同的地方调用。

1.定义模板

name属性，取值为模板的名字

<tempalte name="msgItem"><view><text>{{index}}:{{msg}}</text></view>
</tamplate>

2.使用模板

模板定义后，默认是不显示的，必须使用is属性，声明需要使用的模板，将模板的data传入

<template name="msgItem"><text> {{index}}: {{msg}} </text>
</template>
<!--上下name属性值要一致，data表示传入数据-->
<template is="msgItem" data="{{...item}}"></template>

js:使用 is 属性，声明需要的使用的模板，将模板所需要的 data 传入

Page({data: {item: {index: 0,msg: 'this is a template',time: '2016-09-15'}}
})

显示内容： 0: this is a template

案例2：

<template name="odd"><view> odd </view>
</template>
<template name="even"><view> even </view>
</template><block wx:for="{{[1, 2, 3, 4, 5]}}"><template is="{{item % 2 == 0 ? 'even' : 'odd'}}"/>
</block>

显示内容：

oddevenoddevenodd

微信小程序-WXML-template模板相关推荐

微信小程序使用template模板
首先简单的看一下文件结构: 第一步:新建一个template文件夹,里面新建一个template.wxml和template.wxss: template.wxml: <template nam ...
微信小程序开发template模板使用
在小程序开发过程中,一个项目需要在多处页面使用类似的模块,就需要创建模板减少代码量,同时提高代码复用度.小程序通过template 标签使用模板,template 标签的 is 属性与模板的 name ...
微信小程序中template模板使用
小程序官方使用简介模板 WXML提供模板(template),可以在模板中定义代码片段,然后在不同的地方调用. 定义模板使用 name 属性,作为模板的名字.然后在内定义代码片段,如: <! ...
微信小程序C语言通讯录,微信小程序のwxml列表渲染
列表渲染存在的意义以电商为例,我们希望渲染5个商品,而又希望容易改变,我们就要在wxml中动态添加. {{index+1}}:{{item.name}} Page({ data: { message ...
TP5之微信小程序推送模板消息
TP5之微信小程序推送模板消息 1.获取formId并且存储起来,获取formId方法见: https://blog.csdn.net/u010481239/article/details/78239 ...
微信小程序数据绑定与模板语法
微信小程序数据与模板配置总述: 对应的语法格式与vue的语法格式类似 wxml数据绑定 WXML 模板语法 - 数据绑定.数据绑定的基本原则在 data 中定义数据在 WXML 中使用数据在 ...
微信小程序-WXML转换类型
微信小程序-WXML转换类型情景:需要在WXML中把字符串转化成数字类型解决:引入WXS wxs是小程序的一套脚本语言,结合wxml,可以构建出页面的结构. wxs不依赖于运行时的基础库版本,可以 ...
32套企业店铺展示微信小程序源码模板集合
32套企业店铺展示微信小程序源码模板集合,前端小程序模板,有门锁.水果.母婴等行业源码优势此版本微信小程序为开发版,没有错误,上传就可以用.(无后台!不用后台服务器!) 如果你不想那么麻烦,就想展 ...
微信小程序 - WXML 模板语法 - 条件渲染
1.wx:if (1)在微信小程序中,使用 wx:if="{{condition}}" 来判断是否需要渲染该代码块: <view wx:if="{{conditio ...
微信小程序使用template标签实现五星评分
前言微信小程序特点"无须安装,无须卸载,触手可及,用完即走",适合轻量级应用快速开发.小程序模版思想是它开发的核心思想,可以帮助开发者减少很多重复代码,我们来看看怎么在小程 ...

微信小程序-WXML-template模板

微信小程序-WXML-template模板

1.定义模板

2.使用模板

微信小程序-WXML-template模板相关推荐

最新文章

热门文章