微信小程序入门一：点击事件

公众号：柏战不殆（Baiman_Ber）

//index.js
Page({data:{src:'../images/公众号.jpg',data:'点击我呀'},//点击事件click:function(){this.setData({data:'你学会了吗'})}
})

<!--index.wxml-->
<view><view bindtap='click'>{{data}}</view><view><image mode='aspectFit' src='{{src}}'></image><text>微信公众号：柏战不殆（Baiman_Ber)</text></view>
</view>

image组件默认宽度为300px，高度为225px，mode属性表示图片缩放的方式。有以下四种。

scaleToFill：不保持纵横比缩放图片，使图片的宽高完全拉伸至填满image元素。

aspectFit：保持纵横比缩放图片，使图片的长边能完全显示出来，也就是说，可以完整地将图片显示出来。

aspectFill：保持纵横比缩放图片，只保证图片的短边能完全显示出来，也就是说，图片通常只在水平或垂直方向是完整的，另一个方向将会发生截取。

widthFix：宽度不变，高度自动变化，保持原图宽高比不变。

源码下载：https://download.csdn.net/download/ber_bai/10552094

微信小程序入门一：点击事件相关推荐

【微信小程序入门到精通】— 事件绑定的详细解读
目录前言一.事件绑定导论二.常用事件三.事件对象属性列表 3.1 target 和 currentTarget 的区别 3.2 bindtap 的用法总结前言对于目前形式,微信小程序是一 ...
微信小程序解决view点击事件穿透地图map触发markertap
微信小程序中使用map组件,ios手机中点击地图上的view,会触发底下的markertap,只要底下如果有marker点的话. 这就造成了用户体验不是很好. 然后无意间我发现点击能滑动的scroll ...
微信小程序阻止冒泡点击_微信小程序bindtap事件与冒泡阻止详解
bindtap就是点击事件在.wxml文件绑定: cilck here 在一个组件的属性上添加bindtap并赋予一个值(一个函数名) 当点击该组件时, 会触发相应的函数执行在后台.js文件中定义 ...
微信小程序入门---01
目录微信小程序入门一.小程序简介二.第一个小程序二.小程序代码的构成三.WXML模块四.WXSS 样式五.JS 逻辑交互六.组件七.API 八.WXML 模板语法 - 数据绑定九. ...
微信小程序入门之常用组件(04)
常见组件重点讲解微信小程序中常见的布局组件 view,text,rich-text,button,image,navigator,icon,swiper, radio,checkbox 等一.vi ...
微信小程序入门案例-会议邀请函
微信小程序入门案例-会议邀请函涉及内容:地图目录结构: pages\index\index.wxml <view class="box"><view clas ...
微信小程序入门-音乐播放器
萌新,随便做做,只是了解一下微信小程序,希望可以给看到的胖友一点参考. 之前在网上看到这个人入门四天做完一个,我五天做完了,比他好看,突然有一点自信然后发现自己特别不乐意重新看自己的代码,总觉得写的 ...
A095_day01_微信小程序入门与组件
目录微信小程序入门与组件 - Day01 1.内容介绍 2.微信小程序简介(了解) 2.1.什么是小程序 2.2.微信小程序与app的区别 2.3.小程序在入口 2.4.微信小程序的工作原理 2.5 ...
【微信小程序】微信小程序入门与实战-个人笔记
微信小程序入门与实战文章目录微信小程序入门与实战 1 初识微信小程序 1-1 2020版重录说明 1-2 下载小程序开发工具 1-3 新建小程序项目 1-4 小程序appid的注册 1-5 新版小 ...
做一个微信小程序给TA——程序猿小白的情人节礼物（微信小程序入门——一文学会小程序开发到发布小程序的全过程）
# 情人节可送给女朋友的礼物,或者作为两人的纪念 # 效果展示:微信搜索 "王美美与曾小帅" 小程序即可查看效果 # 微信小程序入门--使用免费后端云(Bmod)搭建留言板 ...

微信小程序入门一：点击事件

公众号：柏战不殆（Baiman_Ber）

微信小程序入门一：点击事件相关推荐

最新文章

热门文章