微信小程序模板template简单用法示例


Posted in Javascript onDecember 04, 2018

本文实例讲述了微信小程序模板template简单用法。分享给大家供大家参考,具体如下:

模板呢,就是为了方便你重复写一些代码而建立的,目前我指发现它的功能适合建立一些表格类型的数据,

比如,录入认得信息啥的(都有名字,年龄,性别啥的)

微信小程序模板template简单用法示例

1. index.wxml代码

<view class="page">
<template name="aafa">
<view> <text> 姓名:{{name}} 年龄:{{age}}</text>
 </view>
</template>
//这是模板显示的四种方式,你看你喜欢哪一种
<template is="aafa" data="{{...zhangsan}}"/>
<template is="aafa" data="{{name:'李四',age:30}}"/>
<template is="aafa" data="{{name:x,age:y}}"/>
<template is="aafa" data="{{name,age}}"/>
<view>------------------------</view>
<template name="msgItem">
 <view>
  <text> {{index}}: {{msg}} </text>
  <text> Time: {{time}} </text>
 </view>
</template>
<template is="msgItem" data="{{...item}}"/>
</view>

2. index.js中代码

//
Page({
 data: {
  name:'唐6',
  age:50,
  x:'郭5',
  y:40,
  zhangsan:{
     name:'张三',
     age:20
   },
  item: {
   index: 0,
   msg: 'this is a template',
   time: '2016-09-15'
  }
 }
})

希望本文所述对大家微信小程序设计有所帮助。

Javascript 相关文章推荐
ListBox实现上移,下移,左移,右移的简单实例
Feb 13 Javascript
浅谈Javascript中Object与Function对象
Sep 26 Javascript
JavaScript控制浏览器全屏及各种浏览器全屏模式的方法、属性和事件
Dec 20 Javascript
Javascript中字符串相关常用的使用方法总结
Mar 13 Javascript
vue拦截器实现统一token,并兼容IE9验证功能
Apr 26 Javascript
使用json-server简单完成CRUD模拟后台数据的方法
Jul 12 Javascript
vue项目使用高德地图的定位及关键字搜索功能的实例代码(踩坑经验)
Mar 07 Javascript
javascript实现前端成语点击验证
Jun 24 Javascript
vue实现匀速轮播效果
Jun 29 Javascript
在vue中配置不同的代理同时访问不同的后台操作
Sep 11 Javascript
浅谈Vue static 静态资源路径 和 style问题
Nov 07 Javascript
uni-app 微信小程序授权登录的实现步骤
Feb 18 Javascript
vue项目刷新当前页面的三种方法
Dec 04 #Javascript
微信小程序之swiper滑动面板用法示例
Dec 04 #Javascript
vue项目每30秒刷新1次接口的实现方法
Dec 04 #Javascript
详解webpack4之splitchunksPlugin代码包分拆
Dec 04 #Javascript
React Native中Mobx的使用方法详解
Dec 04 #Javascript
element ui table(表格)实现点击一行展开功能
Dec 04 #Javascript
elementUI中Table表格问题的解决方法
Dec 04 #Javascript
You might like
用PHP写的一个冒泡排序法的函数简单实例
2016/05/26 PHP
浅谈php中的循环while、do...while、for、foreach四种循环
2016/11/05 PHP
点击广告后才能获得下载地址
2006/10/26 Javascript
通过 Dom 方法提高 innerHTML 性能
2008/03/26 Javascript
URL地址中的#符号使用说明
2011/02/12 Javascript
javascript 实现 秒杀,团购 倒计时展示的记录 分享
2013/07/12 Javascript
javascript 实现字符串反转的三种方法
2013/11/23 Javascript
超棒的响应式布局jQuery插件Freetile.js
2014/11/17 Javascript
jQuery前端框架easyui使用Dialog时bug处理
2014/12/05 Javascript
jQuery中prop()方法用法实例
2015/01/05 Javascript
JavaScript 学习笔记之数据类型
2015/01/14 Javascript
jQuery实现简单的图片查看器
2020/09/11 Javascript
基于jQuery实现二级下拉菜单效果
2016/02/01 Javascript
JavaScript数据存储 Cookie篇
2016/07/02 Javascript
BootStrap中按钮点击后被禁用按钮的最佳实现方法
2016/09/23 Javascript
ES6正则表达式的一些新功能总结
2017/05/09 Javascript
使用OPENLAYERS3实现点选的方法
2020/09/24 Javascript
使用npm安装最新版本nodejs
2018/01/18 NodeJs
Vue兼容ie9的问题全面解决方案
2018/06/19 Javascript
小程序页面动态配置实现方法
2019/02/05 Javascript
小程序实现搜索界面 小程序实现推荐搜索列表效果
2019/05/18 Javascript
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
2019/05/27 jQuery
vue实现移动端触屏拖拽功能
2020/08/21 Javascript
JavaScript实现H5接金币功能(实例代码)
2021/02/22 Javascript
python中使用smtplib和email模块发送邮件实例
2014/04/22 Python
利用Python实现简单的相似图片搜索的教程
2015/04/23 Python
python实现DES加密解密方法实例详解
2015/06/30 Python
Python写的一个定时重跑获取数据库数据
2016/12/28 Python
Python断言assert的用法代码解析
2018/02/03 Python
Python实现截取PDF文件中的几页代码实例
2019/03/11 Python
python中的decimal类型转换实例详解
2019/06/26 Python
基于ccs3的timeline时间线实现方法
2020/04/30 HTML / CSS
遗嘱继承公证书
2014/04/09 职场文书
学校纪律作风整改措施思想汇报
2014/10/11 职场文书
离职报告范文
2014/11/04 职场文书
什么是css原子化,有什么用?
2022/04/24 HTML / CSS