zoukankan      html  css  js  c++  java
  • 小程序(四):模板

    数据:

    复制代码
    // index.js内的数据
    //数据名要对应模板定义的数据名
    //数据要在引入的页面定义
    userinfo: [
    {nickName: '张三',country: '中国',city: '淄博',language: '汉语'},
    {nickName: '李四',country: '美国',city: '西雅图',language: '英语'},
    {nickName: '王五',country: '英国',city: '曼彻斯特',language: '西班牙语'},
    ]
    复制代码

    1、include 

    复制代码
    <!-- template.wxml 页面 -->
    <view wx:for='{{userinfo}}' wx:for-item='label' wx:key='index'>
    <view>{{index+1}}:</view>
    <view>nickName:{{label.nickName}}</view>
    <view>country:{{label.country}}</view>
    <view>city:{{label.city}}</view>
    <view>language:{{label.language}}</view>
    <view>--------------------------------------</view>
    </view>
    复制代码
    复制代码
    <!-- index.wxml 页面 -->
    <include src='../../components/template/template.wxml' />
    <!-- include 引入整个页面,无法引入template标签 -->
    复制代码

    2、import

    复制代码
    <!-- template.wxml 页面 -->
    //必须给template定义name
    <template name='template1'>
    <view wx:for='{{userinfo}}' wx:for-item='label' wx:key='index'>
    <view>{{index+1}}:</view>
    <view>nickName:{{label.nickName}}</view>
    <view>country:{{label.country}}</view>
    <view>city:{{label.city}}</view>
    <view>language:{{label.language}}</view>
    <view>--------------------------------------</view>
    </view>
    </template>
    复制代码
    复制代码
    <!--index.wxml 页面-->
    //按name引入template页面的内容,只引入template对应name标签内的内容
    //
    <import src='../../components/template/template.wxml' />
    <template is='template1' data='{{userinfo}}' />
    复制代码

    3、展示的相同的内容

  • 相关阅读:
    S02_CH15_ AXI_OLED 实验
    S02_CH14_ EMIO_OLED 实验
    S02_CH13_ AXI_PWM 实验
    S02_CH12_ AXI_Lite 总线详解
    【第二季】CH11_ ZYNQ软硬调试高级技巧
    bzoj3028 食物
    Hdu3579 Hello Kiki
    bzoj4872 [Shoi2017]分手是祝愿
    bzoj4873 [Shoi2017]寿司餐厅
    省选模拟赛 LYK loves rabbits(rabbits)
  • 原文地址:https://www.cnblogs.com/max-hou/p/11602203.html
Copyright © 2011-2022 走看看