收藏
回答

getUserInfo响应了contact按钮的事件

问题模块 框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
客户端 小程序 Bug Android 6.0.1 360N4S 6.6.7

<button wx:if="{{!hasWxUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getWxUserInfo">获取头像昵称</button>

<button open-type='contact' class='contact-btn'>

<image src='/image/contact.png' class='contact-img' mode='widthFix' />

</button>

以上2个button在同一个页面,点击【获取头像昵称】时,响应了contact事件,请官方同学验证下,谢谢!

最后一次编辑于  2018-06-26  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏投诉关注问题回答

2 个回答

  • 娇华
    娇华
    2018-06-26

    你好,没有复现你说的情况,应该是你的代码逻辑上出了问题吧

    2018-06-26
    赞同
    回复 1
    • Jacky
      Jacky
      2018-06-26

      页面简单到爆,js就是跳转页面,无逻辑。以下贴出完整代码,供参考,还请帮忙再看看,谢谢


      <view class='container'>

      <view class='account'>

      <view class='left'>

      <text class='username'>{{wxUserInfo.nickName}}</text>

      </view>

      <view class='right'>

      <button wx:if="{{!hasWxUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getWxUserInfo">获取头像昵称</button>

      <block wx:else>

      <image class="avatar" src="{{wxUserInfo.avatarUrl}}" mode='scaleToFill' />

      </block>

      </view>

      </view>


      <progress percent='100' stroke-width='1' activeColor='#F2F2F2' class='seperator' />


      <view class='link'>

      <view class='item'>

      <text class='text'>去填问卷</text>

      <image src='/image/blog.png' class='blog-img' mode='widthFix' bindtap='goToBeforeQu' />

      </view>

      <progress percent='100' stroke-width='1' activeColor='#F2F2F2' class='seperator' />

      <view class='item'>

      <text class='text'>我的报告</text>

      <image src='/image/report.png' class='report-img' mode='widthFix' bindtap='goToBeforeQu' />

      </view>

      <!--

         <progress percent='100' stroke-width='1' activeColor='#F2F2F2' class='seperator' />

         <view class='item'>

           <text class='text'>常见问题</text>

           <image src='/image/ask.png' class='ask-img' mode='widthFix' />

         </view>-->

      <progress percent='100' stroke-width='1' activeColor='#F2F2F2' class='seperator' />

      <view class='item'>

      <text class='text'>联系客服</text>

      <button open-type='contact' class='contact-btn'>

      <image src='/image/contact.png' class='contact-img' mode='widthFix' />

      </button>

      </view>

      <progress percent='100' stroke-width='1' activeColor='#F2F2F2' class='seperator' />

      </view>

      </view>


      ===========================================


      .container {

      width: 100%;

      height: 100%;

      margin: 0;

      padding: 0;

      display: flex;

      flex-direction: column;

      align-items: center;

      }


      .account {

      width: 77.6%;

      display: flex;

      flex-direction: row;

      align-items: left;

      }


      .account .left {

      width: 50%;

      display: flex;

      flex-direction: column;

      justify-content: center;

      align-items: left;

      }


      .username {

      font-family: SourceHanSans;

      font-size: 5.86vw;

      color: #231815;

      margin-top: 25%;

      }


      .gender {

      font-family: SourceHanSans;

      color: #5e5e5e;

      font-size: 3.73vw;

      padding-top: 5%;

      }


      .account .right {

      width: 50%;

      display: flex;

      flex-direction: row-reverse;

      }


      .avatar {

      width: 25.33vw;

      min-height: 25.33vw;

      max-height: 25.33vw;

      margin-top: 10%;

      margin-right: 5%;

      border-radius: 50%;

      }


      .seperator {

      width: 77.6%;

      margin-top: 4%;

      margin-bottom: 4%;

      }


      .link {

      display: flex;

      flex-direction: column;

      align-items: center;

      width: 100%;

      }


      .item {

      display: flex;

      flex-direction: row;

      align-items: center;

      justify-content: space-between;

      width: 77.6%;

      }


      .text {

      font-size: 4.8vw;

      line-height: 4.8vw;

      font-family: SourceHanSans;

      color: #535353;

      margin-top: 3%;

      }


      .blog-img {

      width: 3.73vw;

      height: auto;

      margin-top: 2%;

      }


      .report-img {

      width: 4.53vw;

      height: auto;

      margin-top: 2%;

      }


      .ask-img {

      width: 4.8vw;

      height: auto;

      margin-top: 2%;

      }


      .contact-img {

      width: 5.06vw;

      height: auto;

      }


      .contact-btn {

      width: 5.06vw;

      height: 4.8vw;

      margin-top: 2%;

      position: static;

      display: flex;

      margin-left: 0;

      margin-right: 0;

      padding-left: 0;

      padding-right: 0;

      box-sizing: none;

      font-size: none;

      text-align: none;

      text-decoration: none;

      line-height: none;

      border-radius: 0;

      overflow: none;

      color: rgba(0, 0, 0, 0);

      background-color: rgba(0, 0, 0, 0);

      }


      ==================================================


      const app = getApp()

      const commonConst = require('../../utils/commonConst.js')//获取常量定义类

      Page({

      data: {

      wxUserInfo: {},

      hasWxUserInfo: false,

      canIUse: wx.canIUse('button.open-type.getUserInfo')

      },

      onLoad: function () {

      this.loadWxUserInfo()

      },

      loadWxUserInfo: function () {

      console.log('account loadWxUserInfo')

      if (app.globalData.wxUserInfo) {

      console.log('account step1')

      this.setData({

      wxUserInfo: app.globalData.wxUserInfo,

      hasWxUserInfo: true

      })

      } else if (this.data.canIUse) {

      // 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回

      // 所以此处加入 callback 以防止这种情况

      console.log('account step2')

      app.userInfoReadyCallback = res => {

      console.log('tttttttttttttttt')

      this.setData({

      wxUserInfo: res.userInfo,

      hasWxUserInfo: true

      })

      }

      } else {

      console.log('account step3')

      // 在没有 open-type=getUserInfo 版本的兼容处理

      wx.getUserInfo({

      success: res => {

      app.globalData.wxUserInfo = res.userInfo

      this.setData({

      wxUserInfo: res.userInfo,

      hasWxUserInfo: true

      })

      }

      })

      }

      },

      getWxUserInfo: function (e) {

      console.log(e)

      app.globalData.wxUserInfo = e.detail.userInfo

      this.setData({

      wxUserInfo: e.detail.userInfo,

      hasWxUserInfo: true

      })

      },

      goToBeforeQu: function () {

      wx.navigateTo({

      url: '../beforeQu/beforeQu'

      })

      },

      onShareAppMessage: function () {

      return {

      title: commonConst.SHARE_TITLE_INDEX,

      imageUrl: '/image/snake.png',

      path: '/pages/index/index?referOpenid=' + wx.getStorageSync('openid'),

      success: function (res) { },

      fail: function (res) { }

      }

      }

      })


      2018-06-26
      回复
  • Jacky
    Jacky
    2018-06-26

    补充:我把css中的【.contact-btn】注释掉就好了,这个太扯了。。。

    2018-06-26
    赞同
    回复 1
    • Jacky
      Jacky
      2018-06-26

      我把css样式一个一个去掉尝试,发现是【position: static;】存在时就出问题了,官方的同学可以重现下

      2018-06-26
      回复