注意在小程序中内外this的区分

最新推荐文章于 2024-10-11 19:10:48 发布

beichen3997

最新推荐文章于 2024-10-11 19:10:48 发布

阅读量214

点赞数

CC 4.0 BY-SA版权

分类专栏： wepy 文章标签： wepy 小程序 this this.$apply（）

本文链接：https://blog.youkuaiyun.com/beichen3997/article/details/89209401

wepy 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一个使用WePY框架实现的微信小程序登录流程，包括调用微信登录接口获取临时登录凭证，通过后端API进行登录验证并存储用户信息。同时展示了页面的基本布局和加载状态的处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<template>
  <view class="container">
    <image class="containers" src='../assets/images/page.png'></image>
    <view class="size">欢迎来到</view>
    <loading hidden="{{loadingHidden}}">
      加载中...
    </loading>
     <van-notify id="custom-selector" />
    <van-notify id="van-notify" />
  </view>
</template>

<script>
import wepy from 'wepy'
import fetch from '../utils/fetch.js'
import Notify from '../components/vant/notify/notify'
export default class Index extends wepy.page {
  config = {
    navigationBarTitleText: 'wechat',
    'usingComponents': {
      'van-notify': '../components/vant/notify/index'
    }
  }
  onShow () {
    this.login()
  }
  data = {
    loadingHidden: true
  }
  methods = {
  }
  login () {
     // 显示正在加载
    this.loadingHidden = false
    this.$apply()
    const _this = this
    wepy.login({
      success (res) {
        fetch({
          url: 'https://yx.seee.com.cn/ashare/edocApp/login',
          method: 'POST',
          data: {
            'PARAMETER': {
              'WECHAT_CODE': res.code
            }
          }
        }).then((res) => {
          _this.loadingHidden = true
          _this.$apply()
          if (res.data.RESPONSE_HEADER && res.data.RESPONSE_HEADER.RESPONSE_STATUS === 'Y') {
            if (res.data.RESPONSE_CONTEXT && res.data.RESPONSE_CONTEXT.USER_NAME) {
              wepy.setStorageSync('userName', res.data.RESPONSE_CONTEXT.USER_NAME)
            }
            if (res.data.RESPONSE_CONTEXT && res.data.RESPONSE_CONTEXT.WECHAT_OPENID) {
              wepy.setStorageSync('openId', res.data.RESPONSE_CONTEXT.WECHAT_OPENID)
            }
            wepy.redirectTo({
              url: 'index'
            })
          } else {
            Notify(res.data.RESPONSE_HEADER.RESPONSE_MESSAGE)
            if (res.data.RESPONSE_HEADER && res.data.RESPONSE_HEADER.WECHAT_OPENID) {
              wepy.setStorageSync('openId', res.data.RESPONSE_HEADER.WECHAT_OPENID)
              wepy.redirectTo({
                url: 'register'
              })
            }
          }
        })
      }
    })
  }
}
</script>
<style lang="less">
.container {
  position:fixed;
  width:100%;
  height:100%;
  .containers {
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
  }
  .size {
    position: fixed;
    top:10%;
    text-align: center;
    width:100%;
    color:#4BD863;
  }
}
</style>