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、微信小程序的数据绑定的更多相关文章

  1. 微信小程序之数据绑定(五)

    [未经作者本人允许,请勿以任何形式转载] 前几篇讲述微信小程序开发工具使用.生命周期和事件. 本次讲述微信小程序数据和视图绑定 >>>数据视图绑定 做前端开发的同学,尤其是WEB前端 ...

  2. 02——微信小程序官方demo讲解——app部分

    第一节讲了目录结构,这节主要讲解下目录中app.js部分. 它由三部分组成app.js.app.json与app.wxss 1.JS部分 1.1概述 //app.js App({ onLaunch: ...

  3. 微信小程序-视图数据绑定

    数据绑定 在逻辑层设置数据例如: Page({ data: { message: 'Hello MINA!' } })//设置了一个属性,名称是message 值为Hello MINA! 在视图显示数 ...

  4. 微信小程序开发--数据绑定

    一.单项数据绑定 <!-- index.wxml --> <view class="container"> <form> <input v ...

  5. 02微信小程序-轮播的宽度100%显示和轮播的基础配置

    1==>如何让轮播的宽度100%显示? 你先给swiper 外面添加一个大盒子,给大盒子一个类 . <view class='lunbobox'> 然后wxss 里面设置 image ...

  6. 微信小程序:数据绑定

    data中的数据不仅仅可以当成文本来显示,还可以当成属性来显示. 注意:属性值要用单引号或双引号引起来. 在微信开发者工具的控制台中点击Wxml会看到 使用Boolean类型充当属性的时候,字符串和花 ...

  7. 微信小程序开发 -- 02

    微信小程序开发 --02 微信小程序在开发中,难度系数不是很大,其中应用的技术也是web开发中常用的技术,虽然在微信开发者工具中的叫法与常见的web开发的叫法不太一样. 首先,在微信小程序开发中,代码 ...

  8. 如何开发微信小程序学习

    文件中 project.config.json是开发者工具为我们自动生成的一个开发者工具的配置文件,主要是保存了一些我们对开发者工具的个性化配置. 一个微信小程序应用至少要有两个文件 一个是app.j ...

  9. SAP UI5和微信小程序对比之我见

    今天继续由SAP成都研究院著名的菜园子小哥Wang Cong,给大家分享他作为一个SAP前端人员是如何看待SAP UI5和微信小程序的异同点的. 关于Wang Cong种菜的手艺,大家请移步到他以前的 ...

随机推荐

  1. Linux日知录(常用问题笔记)

    http://blog.csdn.net/yizhu2000/article/details/70688420)序言 日有一知,当有一录,自09年来,工作所需,接触开源平台,对Linux常有涉猎,其间 ...

  2. AssionShop开源B2C电子商务系统-(一)用例图(转载)

    这篇文章,将有实质的进展.先把大体的需求整理了一份用例图,自认为粒度做的已经很细了,再细就没法搞了.我还是坚信一个原则:自己业余搞的东西千万不要 想一口吃个胖子,这样很容易项目就搞流产了~,废话不多说 ...

  3. Windows下Python添加MySQLdb扩展模块

    [更新 2012-09-16] 这里可以下载已经打包好的EXE文件,http://sourceforge.net/projects/mysql-python/(国内需穿越才可访问) DBank备份下载 ...

  4. 图解SQL inner join、left join、right join、full outer join、union、union all的区别

    转于:http://justcoding.iteye.com/blog/2006487 这是一篇来自Coding Horror的文章. SQL的Join语法有很多:有inner的,有outer的,有l ...

  5. CentOS6X安装PHP5.5

    CentOS6.x默认的php版本是php5.3,已经过时喽,现在最新的稳定版是5.5.38. 安装方法: 1.先下载2个源 rpm -Uvh https://dl.fedoraproject.org ...

  6. C++ STL源代码学习(list篇)

    ///STL list为双向循环链表 struct _List_node_base { _List_node_base* _M_next; _List_node_base* _M_prev; }; t ...

  7. sqlite-在数据库中创建默认时间

    create table log( content ), logtime TIMESTAMP default (datetime('now', 'localtime')) )

  8. php 给图片增加背景平铺水印代码

    如果你想利用php 给图片增加背景平铺水印效果话,必须利用php的一个插件来实例,就是利用imagick,他可以给图片增加背景平铺水印效果哦,下面我们提供一款实例代码. 如果你想利用php教程 给图片 ...

  9. 0049 MyBatis关联映射--一对一关系

    世上的事务总不是孤立存在的,表现在Java类里面,则是类与类之间的关系,比如继承is-a.依赖use-a.关联has-a,反映在数据库中,则是表与表之间的关系,比如外键 关联关系存在着以下几种类型:一 ...

  10. CCNA2.0笔记_二层交换

    VLAN上并不需要配置IP地址,除非是出于管理的需要. 基于Vlan的设计原理,即隔离网络的广播域,再者运行STP来提供二层的防环机制:在同一个设备集中不同Vlan之间是无法通信的(在没有三层设备的情 ...