因为 ,要开发好几个小程序 ,所以肯定要去封装一下请求功能, 下面写好了 ,可以直接复制,我也不知道怎么说 

/**
 *  封装登录请求
 */
function Request({
  url,
  method = 'GET',
  data = {},
  header = {}
}, loading = true) {
  url = 'https://地址' + url
  return new Promise((resolve, reject) => {
    // 显示加载中动画
    if (loading) {
      uni.showLoading({
        title: '加载中...'
      })
    }
    // 发起请求
    uni.request({
      url,
      method,
      data,
      dataType: 'json',
      timeout: 60000,
      header: {
        'X-Access-Token': uni.getStorageSync('token') || ''
      },
      success(response) {
        // 隐藏加载中动画 
        if (loading) {
          uni.hideLoading()
        }
        const {
          data
        } = response
        // 根据状态码进行响应处理
        if (data.code === 200) {
          resolve(data)
        } else {
          // 请求失败
          uni.showToast({
            title: data.message,
            icon: 'none'
          })
          reject(data.message)
        }
      },
      fail(error) {
        // 隐藏加载中动画
        if (loading) {
          uni.hideLoading()
        }
        // 请求失败
        uni.showToast({
          title: error.errMsg,
          icon: 'none'
        })
        reject(error)
      }
    })
  })
}
export default Request

2. 在去建一个 post 和get  ,要不然 每次去弄接口,都要在api 单独的文件中 弄,如果接口变动,在去修改 我觉得比较麻烦 所以 就可以直接在页面中引入 就可以

在去建一个js 文件 
import Request from './HttpRequest.js'


export function getAction(url, parameter) {
  return Request({
    url: url,
    method: 'get',
    params: parameter
  })
}
export function postAction(url, parameter) {
  return Request({
    url: url,
    method: 'post',
    data: parameter
  })
}

 3. 在去页面上引入

<script>
  import { getAction, postAction } from '@/utils/postHttp.js'
  export default {
    methods: {
      //退出登录
      onClickgouto() {
        uni.showModal({
          title: '提示',
          content: '是否确定退出账号',
          success: (res) => { // 使用箭头函数保持正确的上下文
            if (res.confirm) {
              postAction('sys/logout').then((res) => {
                if (res.success) {
                  this.$toast(res.message);
                  uni.removeStorageSync('token');
                  uni.removeStorageSync('userInfo')
                  uni.reLaunch({
                    url: "pages/user/user"
                  })
                } else {
                  this.$toast(res.data.message);
                }
              })
            } else if (res.cancel) {
              console.log('用户点击取消');
            }
          }
        });
      }
    }
  }
</script>

这样就可以使用了

Logo

欢迎加入 MCP 技术社区!与志同道合者携手前行,一同解锁 MCP 技术的无限可能!

更多推荐