美文网首页javascript社区微信小程序
微信小程序中如何引用自定义的类

微信小程序中如何引用自定义的类

作者: 夕夜_如风 | 来源:发表于2019-03-28 11:34 被阅读0次

    1.先封装一个http类,在util/http.js中

    
    import {config} from '../config.js' //引入配置文件,包含了主域名和appkey信息
    
    //发生异常时,配置异常信息
    const tips = {
      1: "抱歉,出现了一个错误",//设置一个默认的错误
      1005: "appkey不存在,请前往www.7yue.pro申请",
      3000: "期刊不存在"
    }
    //http类
    class HTTP {
      //方法
      request(params) {
        // url,data,method,从params里面传过来
    
        if (!params.method) { //如果没有设置mothed的话,就默认设置为get
    
          params.method = "GET"
    
        }
        wx.request({
          url: config.api_base_url + params.url,
          method: params.method,
          data: params.data,
          header: {
            'content-type': 'application/json',
            'appkey': config.appkey
          },
          success: res => {
            let code = res.statusCode.toString() //获取调取成功的状态码,返回的是一个number类型的,需要转为string类型
    
            // console.log(code)
            // 用es6的startsWith 和endSwith判断是不是2开头的状态码,只有2开头的状态码才是正常的
    
            if (code.startsWith('2')) {
    
              params.success(res.data)
    
            } else {
    
              let error_code = res.data.error_code //获取错误码
              
              this._show_error(error_code)
    
            }
    
          },
          fail: err => {
    
            //处理异常
            console.error(err)
    
           
            this._show_error(1)
          }
        })
      }
    
      //一般加下划线去区分私有方法和公有方法,如果看到是私有方法就不要往外export了
      _show_error(err_code) {
        wx.showToast({
          title: tips[err_code],
          icon: 'none',
          duration: 1500
        })
      }
    }
    export {
      HTTP
    }
    

    创建classice.js 去继承HTTP类

    
    class ClassicModel extends HTTP{
    
      getLatest(sCallBack){
        //获取最新期刊
        this.request({//调取HTTP类里面的request方法
          url: 'classic/latest',
          success: res => {
            // console.log(res)
            sCallBack(res)
          }
        })
      }
    }
    
    export { ClassicModel}
    

    在classic.js中引用

    
    //导入http类
    
    import { ClassicModel} from '../../models/classic.js'
    let classic = new ClassicModel()
    
    Page({
    
    
      /**
       * 生命周期函数--监听页面加载
       */
      onLoad: function (options) {
        
        classic.getLatest(res=>{
          // console.log("res:"+res)
            console.log(res)
            this.setData({
              classic:res
            })
        })
    
      },
    
     
    })
    

    控制台是可以输出classcie.js类传过来的信息了


    image.png

    在classic wxml应用

    <v-movie img="{{classic.image}}" content="{{classic.content}}"></v-movie>
    

    相关文章

      网友评论

        本文标题:微信小程序中如何引用自定义的类

        本文链接:https://www.haomeiwen.com/subject/lktqbqtx.html