一,理解

可以把小程序的模板理解成vue中可以复用的封装好的小组件。哪里需要了,就在哪里引入使用。当然页面的渲染是需要数据来驱动的,也就是说,必要的时候,还需要引入数据。

二,使用

定义模板

使用 name 属性,作为模板的名字。然后在内定义代码片段,如:

<template name="msgItem"><view><text> {{index}}: {{msg}} </text><text> Time: {{time}} </text></view>
</template>

使用模板

使用 is 属性,声明需要的使用的模板,然后将模板所需要的 data 传入,如:

<template is="msgItem" data="{{...item}}"/>
//使用三点展开

定义的数据

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

也就是:

小程序学习笔记(3)-模板的操作相关推荐

  1. 微信小程序学习笔记(二)模板与配置

    文章目录 1. WXML 模板语法 1.1 数据绑定 1.1.1 数据绑定的基本原则 1.1.2 在 data 中定义页面的数据 1.1.3 Mustache 语法的格式 1.1.4 Mustache ...

  2. 小程序学习笔记(1)

    小程序学习笔记(1) 以下是学习期间记录的笔记: 10-18号晚上学习笔记: 小程序实际上是需要下载安装的,只是很小,用户基本上觉察不到 组件是具有一定的功能的代码的集合 移动端适配: 物理像素:是图 ...

  3. 微信小程序学习笔记(1)

    微信小程序学习笔记 1.小程序代码结构 2.逻辑层和视图层 3. 小程序的宿主环境(通信模型.运行机制.组件.API) 4. 数据绑定和事件绑定 1.小程序代码结构 当开发者新建一个工程时,项目文件包 ...

  4. 小程序 pagescrollto_微信小程序学习笔记(三)-- 首页及详情页开发

    一.常用组件 在上一个章节中讲解了封装请求数据的模块,在此处请求轮播图的数据 1.首页轮播图数据的请求以及渲染 1.1 轮播图数据的请求 pages/home/home.js import 2 使用组 ...

  5. 微信小程序学习笔记一 + 小程序介绍 前置知识

    微信小程序学习笔记一 1. 什么是小程序? 2017年度百度百科十大热词之一 微信小程序, 简称小程序, 英文名 Mini Program, 是一种不需要下载安装即可使用的应用 ( 张小龙对其的定义是 ...

  6. 微信小程序学习笔记(七)----简单文章推荐列表和分类图标的实现

    想要实现一个顶部是几篇纯文字的推荐文章,推荐文章下面是四个分类图标,具体实现出来是这个样子的,比较简单: 首先先来找一下素材,这几个图标是我在阿里巴巴图标库下载的,这里是下载地址: http://ww ...

  7. 自己的微信小程序学习笔记【3】——第三方UI库Lin-Ui的加载及使用

    其他微信小程序的学习笔记 自己的微信小程序学习笔记[1]--小程序开发工具的使用及项目文件说明 自己的微信小程序学习笔记[2]--从零开始新建项目 文章目录 其他微信小程序的学习笔记 前言 一.Lin ...

  8. 微信小程序学习笔记(一)

    干货来袭 基础前言   微信⼩程序,简称⼩程序,英⽂名 Mini Program ,是⼀种不需要下载安装即可使⽤的应⽤,它实现 了应⽤"触⼿可及"的梦想,⽤⼾扫⼀扫或搜⼀下即可打开 ...

  9. 小程序 - 学习笔记

     一.小程序文档笔记 默认开发目录 开发目录解析 1.  app.js.app.json.app.wxss 这三个文件必须有不能删掉. 一个小程序主体部分由这三个文件组成,而且必须放在项目的根目录 j ...

  10. 微信小程序-学习笔记6-组件

    基础内容组件:icon.text.progress <view class="container"><progress percent="20" ...

最新文章

  1. 当前最佳的YOLOv4是如何炼成的?细数那些小细节
  2. Unity内置的三套消息发送机制的应用实例
  3. jsf 后台参数到页面_JSF:直接从页面将参数传递给JSF操作方法,这是JavaEE 6+的一个不错的功能...
  4. Thread.sleep()和TimeUnit.SECONDS.sleep()的区别与联系
  5. systemtap调试linux内核源码,内核调试工具SystemTap:适合懒人的printk替代品
  6. JVM学习系列之对象访问的两种方式句柄和直接指针
  7. linux扩容系统盘分区,系统盘扩容 扩展分区与文件系统_Linux系统盘
  8. ubuntu20.04版本下,ssh学习传输文件
  9. idea 远程调试resin
  10. The processing instruction target matching [xX][mM][lL] is not allowed
  11. ie11 html5播放器卡,GitHub - yangyin/html5-player: 基于react的h5播放器
  12. 海外 Android 三方应用市场
  13. 大厂Java面试过程中如何介绍自己的项目经历?
  14. 谷爱凌拿到第三金,1620这串数字到底代表什么意思?
  15. 2018GIAC全球互联网架构大会上海站最新日程抢先看!
  16. 苹果笔记本上玩windows to go
  17. kafka Transaction coordinator
  18. Spark环境搭建Standalone模式
  19. 计算机科学个人陈述中文,计算机专业个人陈述二十(计算机科学)
  20. Abp Vnext新增模块

热门文章

  1. Raki的读paper小记:SpanBERT: Improving Pre-training by Representing and Predicting Spans
  2. 神经网络与深度学习第6章:循环神经网络 阅读提问
  3. 写单例模式以及防止反射破坏
  4. 用nginx转发请求tomcat 如何配置访问日志获取真实ip
  5. 常用webservice网址
  6. WPF里面制作圆角文本框
  7. 【Mybatis】Mybatis三大组件之ResultSetHandler
  8. synchronized工作原理剖析(二)
  9. 面试题之GC垃圾回收算法
  10. nacos心跳机制重复发送原理