02、微信小程序的数据绑定
02、微信小程序的数据绑定
目录结构:

模板内容:
使用bindtap绑定事件
<!--index.wxml-->
<view class="container">
<view id='testid' bindtap='clinkMe' data-testName='用户名称' data-testSex='用户性别'>
点击我
</view>
</view>
js内容:
//index.js
//获取应用实例
const app = getApp() Page({
data: {
motto: 'Hello World',
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
clinkMe:function(val){
console.log("这是一个测试");
console.log(val);
//模板虽然定义的是包含大写,但是在使用时必须用小写(微信内部进行了转换)
console.log(val.currentTarget.dataset.testname);
console.log(val.currentTarget.dataset.testsex);
}
})
测试:

参照博客:
找的电影开源项目:
https://github.com/7insummer/orange-can
https://github.com/7insummer/orange-can-server
02、微信小程序的数据绑定的更多相关文章
- 微信小程序之数据绑定(五)
[未经作者本人允许,请勿以任何形式转载] 前几篇讲述微信小程序开发工具使用.生命周期和事件. 本次讲述微信小程序数据和视图绑定 >>>数据视图绑定 做前端开发的同学,尤其是WEB前端 ...
- 02——微信小程序官方demo讲解——app部分
第一节讲了目录结构,这节主要讲解下目录中app.js部分. 它由三部分组成app.js.app.json与app.wxss 1.JS部分 1.1概述 //app.js App({ onLaunch: ...
- 微信小程序-视图数据绑定
数据绑定 在逻辑层设置数据例如: Page({ data: { message: 'Hello MINA!' } })//设置了一个属性,名称是message 值为Hello MINA! 在视图显示数 ...
- 微信小程序开发--数据绑定
一.单项数据绑定 <!-- index.wxml --> <view class="container"> <form> <input v ...
- 02微信小程序-轮播的宽度100%显示和轮播的基础配置
1==>如何让轮播的宽度100%显示? 你先给swiper 外面添加一个大盒子,给大盒子一个类 . <view class='lunbobox'> 然后wxss 里面设置 image ...
- 微信小程序:数据绑定
data中的数据不仅仅可以当成文本来显示,还可以当成属性来显示. 注意:属性值要用单引号或双引号引起来. 在微信开发者工具的控制台中点击Wxml会看到 使用Boolean类型充当属性的时候,字符串和花 ...
- 微信小程序开发 -- 02
微信小程序开发 --02 微信小程序在开发中,难度系数不是很大,其中应用的技术也是web开发中常用的技术,虽然在微信开发者工具中的叫法与常见的web开发的叫法不太一样. 首先,在微信小程序开发中,代码 ...
- 如何开发微信小程序学习
文件中 project.config.json是开发者工具为我们自动生成的一个开发者工具的配置文件,主要是保存了一些我们对开发者工具的个性化配置. 一个微信小程序应用至少要有两个文件 一个是app.j ...
- SAP UI5和微信小程序对比之我见
今天继续由SAP成都研究院著名的菜园子小哥Wang Cong,给大家分享他作为一个SAP前端人员是如何看待SAP UI5和微信小程序的异同点的. 关于Wang Cong种菜的手艺,大家请移步到他以前的 ...
随机推荐
- 使用Wifi连接ADB调试App
前提:你的手机ROOT过,做Android开发的,别跟人说你的手机不是ROOT的. 步骤: 1.在手机上把ADB服务进程的TCP端口设置为5555,这是Android ADB的默认调试商品.这需要 ...
- 建立第一个wcf程序
使用管理员权限启动vs (否者将导致ServiceHost开启失败 权限不足) 1.创建一个空的控制台程序 2.添加程序集引用 System.ServiceModel 3.写入一些代码 如下 usin ...
- Hibernate关联关系(二) Cascade级联
1.cascade定义的是关系两端对象到对象的级联关系:而inverse定义的是关系和对象的级联关系. all : 所有情况下均进行关联操作. none:所有情况下均不进行关联操作.这是默认值. ...
- xjc编码
本篇文章是对jaxb xjc编码的问题进行了详细的分析介绍,需要的朋友参考下 平时喜欢根据写一个xjc批处理命令,根据xsd批量生成java类,觉得很方便也很酷.但是有时候xsd生成的java类中 ...
- Python zip Python zip函数
zip([iterable, ...])zip()是Python的一个内建函数,它接受一系列可迭代的对象作为参数,将对象中对应的元素打包成一个个tuple(元组),然后返回由这些tuples组成的li ...
- C#通过WIN32 API实现嵌入程序窗体
本文实例讲述了C#通过WIN32 API实现嵌入程序窗体的方法,分享给大家供大家参考.具体如下: 这是一个不使用COM,而是通过WIN32 API实现的示例, 它把写字板程序嵌在了自己的一个面板中. ...
- C#新特性, dynamic, ExpandObject
http://msdn.microsoft.com/en-us/library/system.dynamic.expandoobject.aspx using System; using System ...
- powershell文件权限操作
获取文件或文件夹访问权限: Get-Acl -Path <File or Folder Path> | Format-List 修改文件访问权限: 修改文件访问权限需要用到Set-Acl命 ...
- PHP学习笔记(5)GD库画验证码
<?php header("content-type:image/png"); $width = 500; $height = 500; $img = imagecreate ...
- 玩黑客学校CTF
关卡很简单就不细说.不懂的百度 第一关: 源码: 解密得出为JO 第二关: 很明白,表单问题. </script> <div style = "text-align: ce ...