微信小程序模板template簡單用法示例

更新時間：2018年12月04日 11:43:42 作者：我要看一下山頂?shù)娘L景

這篇文章主要介紹了微信小程序模板template簡單用法,結(jié)合實例形式分析了微信小程序模板template的功能、簡單使用方法及相關操作注意事項,需要的朋友可以參考下

本文實例講述了微信小程序模板template簡單用法。分享給大家供大家參考，具體如下：

模板呢，就是為了方便你重復寫一些代碼而建立的，目前我指發(fā)現(xiàn)它的功能適合建立一些表格類型的數(shù)據(jù)，

比如，錄入認得信息啥的(都有名字，年齡，性別啥的)

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'
  }
 }
})

希望本文所述對大家微信小程序設計有所幫助。

您可能感興趣的文章:

微信小程序?qū)崿F(xiàn)手機獲取驗證碼倒計時60s
這篇文章主要為大家詳細介紹了微信小程序?qū)崿F(xiàn)手機獲取驗證碼后倒計時60s，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-05-05
window.setInterval()方法的定義和用法及offsetLeft與style.left的區(qū)別
window.setInterval()方法可以按照指定的周期執(zhí)行來執(zhí)行一段程序。周期是以毫秒為單位的，本文給大家介紹window.setInterval()方法的定義和用法，感興趣的朋友參考下
2015-11-11
json_decode 索引為數(shù)字時自動排序問題解決方法
這篇文章主要介紹了使用son_encode 給前端返回數(shù)據(jù)，結(jié)果順序不對，經(jīng)debug調(diào)試，發(fā)現(xiàn)是json_encode 函數(shù)的問題,變成 " " + 數(shù)字即可,需要的朋友可以參考下
2020-03-03
JavaScript仿京東實現(xiàn)秒殺倒計時案例詳解
這篇文章主要為大家詳細介紹了如何利用JavaScript實現(xiàn)京東秒殺倒計時效果，文中示例代碼介紹的非常詳細，感興趣的小伙伴們可以參考一下
2022-03-03
微信小程序?qū)崿F(xiàn)元素漸入漸出動畫效果封裝方法
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)元素漸入漸出動畫效果封裝方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2019-05-05
shiro授權的實現(xiàn)原理
這篇文章主要介紹了shiro授權的實現(xiàn)原理，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-09-09
js實現(xiàn)隨機數(shù)字字母驗證碼
這篇文章主要為大家詳細介紹了js隨機驗證碼的實現(xiàn)代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2017-06-06
Javascript變量函數(shù)聲明提升深刻理解
本文主要介紹了Javascript變量函數(shù)聲明提升深刻理解，Javascript變量函數(shù)聲明提升Hoisting是在Javascript中執(zhí)行上下文工作方式的一種認識，更多相關知識需要的小伙伴可以參考下面文章詳細內(nèi)容
2022-06-06
javascript實現(xiàn)十六進制顏色值（HEX）和RGB格式相互轉(zhuǎn)換
這篇文章主要介紹了javascript實現(xiàn)十六進制顏色值（HEX）和RGB格式之間的轉(zhuǎn)換,使用正則的方法實現(xiàn)RGB顏色轉(zhuǎn)換為16進制,需要的朋友可以參考下
2014-06-06
Javascript實現(xiàn)圖片加載從模糊到清晰顯示的方法
這篇文章主要介紹了使用Javascript實現(xiàn)圖片加載從模糊到清晰顯示的方法,通俗易懂,需要的朋友可以參考下。
2016-06-06