博客> 微信小程序数据绑定(模板)
微信小程序数据绑定(模板)
2019-12-10 12:02 评论:0 阅读:42 IT喃
微信小程序
背景交代:

这几天公司突然想把公司的小程序开发一下,但是目前还没有小程序开发人员,就委派我学习一下,记录一下学习历程,天道酬勤,(๑•̀ㅂ•́)و✧加油!!

1.创建模板

创建一个template_userInfo.wxml和一个template_userInfo.wxss

<template name='userInfoTmp'>
  <view class='tmpContainer'>
    <view class='userInfoView'>
      <label class='userInfoDsc'>{{dscription}} + 1号楼1单元</label>
    </view>
  </view>
</template>
2.创建数据

在.js文件中,Page()方法里边的data:{}里边创建

    userInfoData:[
      {
        dscription: '姓名:'
      },
      {
        dscription: '性别:'
      },
      {
        dscription: '手机号:'
      },
      {
        dscription: '出生年月:'
      }
    ]
3.数据绑定
// 一定要使用导入
<import src='/pages/template_userInfo/template_userInfo.wxml'>

<view>
  <block wx:for='{{userInfoData}}' wx:key='{{index}}'>
    <view data-index='{{index}}'>
      <template is='userInfoTmp' data='{{...item}}'>
    </view>
  </block>
</view> 
4.显示结果

现在可以使用自己创建的数据了

结尾:

小程序也还是要好好学习一下的,我们一起来多多练习!!

收藏
0
sina weixin mail 回到顶部