设为首页 加入收藏

TOP

小程序mpvue怎么点击按钮获取button里面的值
2019-09-17 19:00:28 】 浏览:23
Tags:程序 mpvue 怎么 点击 按钮 获取 button 面的

在小程序里面是没有dom元素的,这个我们只要会小程序的应该都知道,但是在平时开发中我们偶尔会遇到需要点击某个元素获取它的值的情况,在这里给大家列举了两种情况解决方法

方式一:数据绑定

这种情况的话,对应的场景是只有一个按钮或元素调用这个方法的情况下的

在你的.vue文件中的data数据里面添加变量

 data() {
    return {
     
      msg:'苏喂苏喂苏喂'

    };
getData(){
 console.log( this.msg )
}

按钮上

<button @click="getData()" name="bu">{{msg}}</button>

但是对于多个元素调用该方法的话,这个这种方式是不切实际的,下面第二种方法就是弥补方式一的不足

方式二

.vue文件的data中定义一个变量来接收

 data() {
    return {
     
      concat:'12345678'

    };

在template中,自定义属性data-text

<van-cell-group>
      <van-cell title="电话" value="点击拨打" data-text="*******"  icon="phone" />
      <van-cell title="微信" value="点击复制" data-text="********"  icon="chat" @click="copy($event)"/>
      <van-cell title="邮箱" value="点击复制" data-text="*******" @click="copy($event)" icon="invition"/>
      <van-cell title="博客" value="点击复制" data-text="******
" icon="desktop-o" @click="copy($event)"/>
    </van-cell-group>

函数引用的时候记得一定要传入$event,不然的话,获取到的e会是一个undefined

定义函数

copy(e){
     var that = this;
     console.log(e.currentTarget.dataset.text)
        wx.setClipboardData({
          data: e.currentTarget.dataset.text,
          success: function (res) {
          wx.showModal({
            title: '提示',
            content: '复制成功',
            success: function (res) {
            if (res.confirm) {
              console.log('确定')
            } else if (res.cancel) {
              console.log('取消')
            }
            }
          })
      }
 });

 

】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
上一篇随机生成验证码(JS) 下一篇jstree使用

最新文章

热门文章

Hot 文章

Python

C 语言

C++基础

大数据基础

linux编程基础

C/C++面试题目