minapp

课堂笔记

小程序绑定值

---

xwml文件

<!-- 数据绑定 -->
<view>{{msg}}</view>
<view>{{data_msg}}</view>
<view>{{boolean_msg}}</view>
<view>{{student.std_name}}</view>
<!-- 组件属性的绑定，自定义属性，属性名为defined -->
<view data-deifined="{{num}}">自定义</view>

<!-- 控制属性的绑定 -->
<view wx:if="{{num>200}}">num>200</view>
<view wx:elif="{{num>100}}">num>100小于两百</view>
<view wx:else="{{num<100}}">num小于100</view>

js文件

data: {
  msg: '绑定字符串',
  data_msg: 1,
  boolean_msg: true,
  student: {
    std_id: 1,
    std_name: 'tq',
    std_class: '618'
  },
  num: 103,
  condition: true
  }

列表的渲染

wxml文件部分

<!-- 列表的渲染
    item指的是数据里面的每一个元素（固有的）
    index指的是数组的下标（固有的）
    取别名：wx:for-item="别名"给数组里每一个元素取别名
    wx:for-index="别名"
 -->
<view wx:for="{{users}}" wx:for-item="std" wx:for-index="outdex" wx:key="outdex">
学生姓名：{{std.user_name}}
学生部门：{{std.user_department}}
数组的下标：{{outdex}}
</view>

<button bindtap="message" data-var="20">点我传递参数</button>

js部分：

// pages/wxml/wxml.js
Page({
  data: {
    msg: '绑定字符串',
    data_msg: 1,
    boolean_msg: true,
    student: {
      std_id: 1,
      std_name: 'tq',
      std_class: '618'
    },
    num: 103,
    condition: true,
    users: [
      {
        user_name: '张三',
        user_department: '软件学院'
      }, {
        user_name: '李四',
        user_department: '软件学院'
      }, {
        user_name: '王五',
        user_department: '软件学院'
      }, {
        user_name: '赵六',
        user_department: '软件学院'
      }, {
        user_name: '孙七',
        user_department: '软件学院'
      }, {
        user_name: '周八',
        user_department: '软件学院'
      }
    ]
    },
    message: function(e) {
      var a = e.currentTarget.dataset.var;
      wx.showToast({
        title: a
      })
    }
  
})

navigator超链接导航组件

target可以在小程序之间跳转

url当前小程序跳转