小程序报错:Component "pages/..." does not have a method "formSubmit" to handle even "submit"

在页面使用了 from+button 实现一个拖拽按钮,,控制台报错,如下:

 按照警示的大概意思,在这个页面不能使用formSubmit方法操作submit,那我去掉bindsubmit事件试试。嗯,去掉之后发现没有该报错了。

 

页面wxml代码:

<view  class="feed"  bindtouchmove="touchMoveChange" bindtouchend="touchEndChange" disable-scroll="{{disableScroll}}"   style="left:{{feed_style.x}};top:{{feed_style.y}};">
    <form  bindsubmit="formSubmit"  report-submit="true">//bindsubmit去掉后没有报错
      <button catchtap="addQuestionClick" class="heart {{addAnimate?'active':''}}"  id="like1"  rel="like"  style="background-position: {{cssAnimate}} center;"  formType="submit"><image class="add" src="{{srcUrl}}questAdd.png"></image></button>
    </form>//catchtap实现点击跳转页面,可阻止事件冒泡
</view>

wxss样式:

.feed{
  position:  fixed;
  z-index:  1000;
}
button.heart::after{
  border:none;
}
.heart{
  width:94rpx;
  height:94rpx;
  border:1rpx solid #f1f1f1;
  border-radius: 50%;
  background: #ffffff;
  padding: 0;
  text-align: center;
  line-height: 94rpx;
}
.heart.active{
  transition: all .2s;
}
.heart image.add{
  width:46rpx;
  height:46rpx;
  display: block;
  margin:0 auto;
  margin-top: 24rpx;
}

js部分:

--- data中定义变量:

// 添加问答按钮
    //这个参数是定位使用的 x , y 值 , 仅在js里面传递的参数:
    feed_style: {
      x: "86%",
      y: "80%",
    },
    // 用于保存屏幕页面信息
    screen: {
      width: "",
      height: ""
    },
    preX: '',//上次的x值
    preY: '',//上次的y值
    //拖拽按钮动画
    addAnimate: false, 
    disableScroll:false,

--- onload中窗口宽高获取:

    var self = this;
    wx.getSystemInfo({
      success: function (res) {
        console.log(res);
        console.log("platform", res.platform);
        console.log(res.model);
        // 可使用窗口宽度、高度
        console.log('height=' + res.windowHeight);
        console.log('width=' + res.windowWidth);
        // Math.ceil()
        if (res.platform == "android") {
          res.windowHeight = res.screenHeight;
        }
        self.setData({
          screen: {
            width: res.windowWidth,
            height: res.windowHeight,
            pixelRatio: res.pixelRatio,
            ratio: res.windowWidth * res.pixelRatio / 750
          }
        })
      }
    });

--- 移动和结束时的事件:

// addbtn-移动
  touchMoveChange(e) {
    var tmpx = parseInt(e.touches[0].clientX);
    var tmpy = parseInt(e.touches[0].clientY);
    if (tmpx <= 50 || tmpy <= 50 || tmpx >= this.data.screen.width || tmpy >= this.data.screen.height - 50) {
    } else {
      if (tmpx != this.data.preX || tmpy != this.data.preY) {
        console.log(e.touches[0].clientX, "-X-", e.touches[0].pageX)
        console.log(e.touches[0].clientY, "-Y-", e.touches[0].pageY)
        this.data.preX = tmpx
        this.data.preY = tmpy
        this.setData({
          feed_style: {
            x: tmpx - 50 + "px",
            y: tmpy - 50 + "px"
          },
          disableScroll:true,
        })
      }
    }
  },

  // addbtn-结束     鼠标拿开之后,让按钮默认显示在最右侧,x为初始值,y为此时值
  touchEndChange: function (e) {
    this.setData({
      feed_style: {
        x: "86%",
        y: this.data.preY - 50 + "px"
      },
      addAnimate: true
    })
  },

 

(若有更好的方法,欢迎留言讨论:))

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
回答: 引用\[1\]中提到,小程序登录的过程是通过调用wx.login()方法获取一个code,然后将code和appid传给后台进行登录凭证校验,后台再调用微信的登录凭证校验接口。前端通过调用后台接口获取到一个jwt字符串格式的token,其中包含了session_key和openid等信息。然后前端进行jwt解析,获取到session_key和openid。在引用\[2\]中提到,点击按钮报错的原因是"pages/login/login"组件没有一个名为"glogin"的方法来处理"tap"事件。解决方案是在该组件中添加一个名为"glogin"的方法来处理该事件。至于引用\[3\]中提到的接口权限申请,它是针对具备与地理位置强相关的使用场景的小程序开放的,并且需要在小程序管理后台的「开发」-「开发管理」-「接口设置」中自助开通该接口权限。该接口权限申请入口将于2022年3月11日开始内测,于3月31日全量上线。从4月18日开始,在代码审核环节将检测该接口是否已完成开通,如未开通,将在代码提审环节进行拦截。 #### 引用[.reference_title] - *1* [微信小程序wx.login()登录](https://blog.csdn.net/Axiaoheng_/article/details/117324368)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* [uni-app调用微信小程序接口报错Componentpages/login/login“ does not have a method “onChooseAvatar“](https://blog.csdn.net/qq_32263431/article/details/124002374)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [微信小程序报错:WAServiceMainContext.js?t=wechat&s=1684052115130&v=2.31.1:1 wx.chooseAddress need to be](https://blog.csdn.net/y662225dd/article/details/130671185)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值