精华内容
下载资源
问答
  • 微信小程序点击事件传递参数

    千次阅读 2021-03-11 09:29:52
    在维信小程序开发中传递参数的方式不同于前端开发其他场景中直接加参数的方式,小程序在参数的传递时,采用事件对象的自定义属性的方式(和vue项目中的参数传递不同),具体实现如下: wxml: <view bindtap=...

    在维信小程序开发中传递参数的方式不同于前端开发其他场景中直接加参数的方式,小程序在参数的传递时,采用事件对象的自定义属性的方式(和vue项目中的参数传递不同),具体实现如下:

    wxml:

    <view bindtap="addBind" wx:for="list" data-item="{{item}}"
     wx:key="name">
    	<view>{{ item.name }}</view>
    </view>
    // 自定义属性传参方式传参  data-xxx
    

    js中:

    
    bindtap (e){
        // 传递的参数
        let item = e.currentTarget.dataset.item
       console.log(e.currentTarget.dataset.item) // 打印传递过来的参数(我这里传递过来的是一个对象,也就是list 数组中的某一个元素)
       // 比如要传递每一项的id选项时就是  item.id
    }
    

    这个和vue开发传参区别还是很大的,可能写习惯了vue开发的伙伴们在写小程序开发传参时可能会习惯性的出错 !

    展开全文
  • 想在主页上添加一个搜索功能 但是加上之后发现原有的页面点击事件没有反应了 个人怀疑是input和bindtap互相影响?有人碰到类似的情况吗 是怎么解决的{{item}}this is a textLECTURE THEATRES``Page({data: {input...

    想在主页上添加一个搜索功能 但是加上之后发现原有的页面点击事件没有反应了 个人怀疑是input和bindtap互相影响?

    有人碰到类似的情况吗 是怎么解决的

    {{item}}

    this is a text

    LECTURE THEATRES

    ``

    Page({

    data: {

    inputValue: '',//点击结果项之后替换到文本框的值

    adapterSource: ["123", "321", "666", "weixin", "WeiXin", "wechat", "android", "Android", "ios", "iOS", "java", "javascript", "微信小程序", "微信公众号", "微信开发者",

    "微信开发者工具"],//本地匹配源

    bindSource: [],//绑定到页面的数据,根据用户输入动态变化

    actionSheetHidden: true,

    },

    onLoad: function () {

    //这里可以写请求网络数据的代码,请求服务器的匹配源

    },

    actionSheetTap: function () {

    this.setData({

    actionSheetHidden: !this.data.actionSheetHidden

    })

    },

    actionSheetbindchange: function () {

    this.setData({

    actionSheetHidden: !this.data.actionSheetHidden

    })

    },

    //当键盘输入时,触发input事件

    bindinput: function (e) {

    var prefix = e.detail.value//用户实时输入值

    var newSource = []//匹配的结果

    if (prefix != "") {

    this.data.adapterSource.forEach(function (e) {

    if (e.indexOf(prefix) != -1) {

    newSource.push(e)

    }

    })

    }

    if (newSource.length != 0) {

    this.setData({

    bindSource: newSource

    })

    } else {

    this.setData({

    bindSource: []

    })

    }

    },

    itemtap: function (e) {

    this.setData({

    inputValue: e.target.id,

    bindSource: []

    })

    },

    artsblock: function () {

    wx.navigateTo({

    url: "../lectureTheatres/lectureTheatres",

    })

    },

    })

    展开全文
  • 例如点击事件 click 在小程序中是叫做 bindtab 用法如下 <view class="icon_check_item_body" bindtap="iconClick" hover-class="icon_hover"> <image src="{{item.image}}" class="icon_ch

    小程序不是浏览器

    小程序毕竟不是浏览器,所以很多我们写js时的那些内置对象及事件都没有,小程序为了满足用户需求会模仿做一些原生html元素的事件

    bindtab

    例如点击事件 click 在小程序中是叫做 bindtab
    用法如下

    <view class="icon_check_item_body" bindtap="iconClick" hover-class="icon_hover">
            <image src="{{item.image}}" class="icon_check_img"></image>
            <text class="icon_check_text">{{item.tip}}</text>
          </view>
    

    传参

    小程序中事件传递参数和我们平时形参实参的方式不同,
    小程序的事件会自带一个 event 对象, 基本很多逻辑都是可以依赖 event 完成的,啧,总感觉微信开发小程序的团队在偷懒。。。。。。
    具体用法如下
    在这里插入图片描述
    这是官网的示例。小程序文档写的不是很好,有些东西不好找,不然我也不会考虑写这个文章了,希望能帮到一些人吧。。
    以下是文档地址
    小程序事件文档
    往下翻到 dataset 哪个板块就是讲传递参数的

    展开全文
  • 自定义的属性必须跟点击事件函数写在同一个标签内,否则赋值不成功

    在这里插入图片描述
    自定义的属性必须跟点击事件函数写在同一个标签内,否则赋值不成功

    展开全文
  • 在测试小程序的时候,发现了这样的一个bug,点击子元素事件d的时候触发父元素的点击事件,从而执行父级的点击事件,跳转到了父级的点击事件的页面了。 其实很简单,只需要把子级的bindtap改成catchtap,就可以...
  • 小程序data-用法 data- :会在事件触发时传递给SERVICE (js文件中的data) 书写方式: 以data-开头,后面接名称,多个单词由连字符-链接,不能有大写(大写会自动转成小写)如data-element-type 最终在 event....
  • bindtap就是点击事件在.wxml文件绑定:cilck here在一个组件的属性上添加bindtap并赋予一个值(一个函数名)当点击该组件时, 会触发相应的函数执行在后台.js文件中定义tapMessage函数://index.jsPage({data: {mo: '...
  • 当我们在xxx.wxml页面中,给某个位置绑定事件并想传值时,例如:我们在循环一组元素,每个元素的id是不同的,点击不同元素,根据不同id,请求不同的详细信息 这时,我们需要这样做: xxx.wxml中: <view ...
  • 这里写目录标题bind与catch的区别----------------点击事件单击):bindtap双击事件长按事件:bindlongpress、bindlongtap长按与点击事件的执行顺序与关系----------------键盘输入事件:bindinput输入框聚焦:...
  • 1、从0开始写小程序(一)点击事件,获取元素id,页面传值不是专业程序员,突然就想研究一下首先遇到的问题就是参数传递;小程序里的点击触发事件、如何获取当前元素的id、如何吧值传递到下一个页面例:wxml里: 蔬菜...
  • 我们都是微信小程序中catchtap绑定的是阻止冒泡事件的发生,换句话说就是仅对当前元素本身生效。 常用场景:假如点击父级盒子触发A事件点击子元素触发B事件,但是这样实际的效果却是,点击父级也会触发子元素的...
  • 自定义事件分析,用api的方式,点击“保存并测试”,在微小宝中安卓手机会失败,不显示数据,苹果手机就可以。 进行“事件分析”时,想要查看自己定义的属性的值,就把自己定义的属性,添加到 “分组”中,不要添加...
  • 小程序中使用bind关键字绑定事件,常见事件 tap 并且很多组件都有自己对应的一些事件,比如 input组件的 bindinput radio-group组件中的bindchange bindtap index.wxml index.js <view bindtap="add">点击...
  • 什么是事件事件是视图层到逻辑层的通讯方式。事件可以将用户的行为反馈到逻辑层进行处理。...如bindtap,当用户点击该组件的时候会在该页面对应的Page中找到相应的事件处理函数。 Click me! 在相应的Page...
  • 场景:最近开发微信小程序时候遇到了点击页面中的元素,js捕捉点击事件,并获取该元素的一些属性(比如我自定义了一个author="李一博"),那么如何快速获取这个属性呢?其实首先要改变一下写法,用【data-】开头,元素...
  • 普通的web开发可以通过JavaScript获取HTML的Dom结构,但是小程序不可以,小程序实现此功能的方式:数据绑定+data- 去更改标签类名。step 1 给选定的标志 {{}} & data-num此处只绑定了一个类名,也可以绑定N个...
  • 使用uniapp开发小程序的时候,@click.stop来做事件冒泡没有作用。 查看官方给出的文档是这样写应该就可以了,但是就是没起作用,点击子组件的时候还是触发了父组件的事件。 <u-field disabled=true maxlength...
  • 点击</button> utils .js function debounce(fn, interval) { var timer; var gapTime = interval || 1000;//间隔时间,如果interval不传,则默认1000ms return function() { clearTimeout(timer); ...
  • 微信展示列表效果借助于 wx:for通常我们在静态创建一个view或是button,他对应的点击事件很简单我的页面实例图.wxml文件代码示例:红框里的都是每个view,对应绑定的点击方法名字,接下来,我们在.js文件中分别来实现...
  • 小程序在组件上绑定事件后,传递参数的方式不同于前端开发其他场景中直接加参数的方式,小程序在参数的传递时,采用事件对象的自定义属性的方式,具体实现如下: wxml: <view bindtap="goTo" data-index={{item...
  • 微信小程序传参 data-index wxml <view wx:for="{{title}}" wx:key="index" data-index="{{index}}" bindtap="onTitle">{{item.title}} <view class="line" wx:if="{{select == index}}"></view>...
  • tap:点击事件; longtap:长按事件; touchstart:触摸开始; touchend:触摸结束; touchcansce:取消触摸; 事件绑定: bind绑定; catch绑定;(能阻止事件冒泡) mut-bind 互斥事件绑定 普通事件绑定 ...
  • 微信小程序开发之路(3)— 添加一个Button按钮点击事件 一、前言 之前文章我们设置的都是静态的页面,我们接下来需要增加一个点击Button按钮点击事件。 二、增加一个Button按钮 将pages/hello/hello.wxml文件修改为...
  • 微信小程序事件绑定

    2021-01-11 20:38:08
    程序中绑定事件,通过bind关键字来实现。如 bindtap bindinput bindchange 等 不同的组件⽀持不同的事件,具体看组件的说明即可 功能: 在输入框中写入文字,将文字实时映射到其他地方,输入框中文字改变,映射也要...
  • 1、点击事件,获取元素id,页面传值参数传递;小程序里的点击触发事件、如何获取当前元素的id、如何吧值传递到下一个页面例:catchtap是点击触发 触发的内容是等于号后面“”里的函数方法js里:gotoresult:function ...
  • 小程序list数据带值跳转,一般直接通过设置item的id来标识或者通过设置键值data-xxxx的方式标识。如下图所示 解析出来的结果如下图: 我们看到它在元素上绑定了一个checkSchoolLogin事件,触发这个事件时需要...
  • 微信小程序中的事件捕获和冒泡 学习微信小程序原生开发,记录一下,防止忘记。 事件捕获:事件触发的过程是从外层的容器一层一层的向目标元素触发。 事件冒泡:事件的触发从里层依次向最外层传递。 如图: 代码: ...
  • 微信小程序父级组件调用自定义组件中事件的方法如下: 假设自定义组件引入如下:(id是必须的) <count-down id="countDown"></count-down> count-down中有事件: Component({ methods: { ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 123,538
精华内容 49,415
关键字:

微信小程序单击事件

微信小程序 订阅