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

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

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

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

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

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

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

希望本文所述對大家微信小程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

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