小程序解析富文和ajax的封装

- 解析富文本

1. wxParse

   • github地址：https://github.com/icindy/wxParse
   • 使用方法：
     1.下载github官方wxParse目录到小程序项目的根目录下

文件结构：

• wxParse/
  -wxParse.js(必须存在)
  -html2json.js(必须存在)
  -htmlparser.js(必须存在)
  -showdown.js(必须存在)
  -wxDiscode.js(必须存在)
  -wxParse.wxml(必须存在)
  -wxParse.wxss(必须存在)
  -emojis(可选)

2.引入必要文件
//在要使用的页面中引入WxParse模块

var WxParse = require('/wxParse/wxParse.js');

3.将WxParse.css引入在app.wxss中

@import "/wxParse/wxParse.wxss";

4.将富文本绑定给wxParse

格式：WxParse.wxParse(参数1, 参数2, 参数3, 参数4, 参数5);
参数说明：

• 参数1.bindName绑定的数据名(必填)
• 参数2.type可以为html或者md(必填)
• 参数3.data为传入的具体数据(必填)
• 参数4.target为Page对象,一般为this(必填)
• 参数5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)
  */

例如：

var article = '<div>我是HTML代码</div>';
var that = this;
WxParse.wxParse('article', 'html', article, that, 5);

5.模版引用

// 引入模板

//这里data中article为bindName

<template is="wxParse" data="{{wxParseData:article.nodes}}"/>
``
​

rich-text
//封装数据请求环境地址的统一
//env.js
module.exports={
  //开发环境
  dev:{
    baseUrl:'http://127.0.0.1:8080'
  },
  //生产环境
  prod:{
    baseUrl:'https://api.it120.cc'
  },
  //测试环境
  test:{
    baseUrl:'https://api.1909A.com'
  }
}
//业务数据请求方法的统一
//商品列表接口
//详情接口
//加入收藏
//搜索接口
//api.js
const { request }=require('./request.js');

//项目中用到的各种业务接口的封装

module.exports={

  //商品分类接口
  goodsCate:()=> {

    return request('shop/goods/category/all','GET','',true)

  },
  //banner图接口
  getBanner:()=>{},
  //商品详情接口
  getDetail:(id)=>{

    return request('shop/goods/detail','GET',{id:id},true)
  },
  //其他接口....

}


# ajax的封装（ajax:axios,wx.request,xmlHttpRequest,fetch）

//request.js 针对wx.requeste的二次封装
const { baseUrl } = require('./env.js').prod
//封装ajax


const vipUrl = 'hjl'
module.exports = {
  request: function (url, method = "GET", data = {}, isSubDomain = true) {
    let fullUrl = `${baseUrl}/${isSubDomain ? vipUrl : ''}/${url}`;
    wx.showLoading({
      title: '玩命加载中',
    })
    return new Promise((resolve, reject) => {
      wx.request({
        url: fullUrl,
        method,
        data,
        header: {
          'Content-type': 'application/x-www-form-urlencoded'
        },
        success(res) {
          // console.log('res::',res)
          if (res.statusCode === 200 && res.data.code === 0) {
            resolve(res.data.data)
            wx.hideLoading()
          } else {
            wx.showToast({
              title: '接口有问题，请检查',
            })
            reject('接口有问题，请检查')
          }
        },
        fail(error) {
          wx.showToast({
            title: '数据接口有问题',
          })
          reject('数据接口有问题')

        }
      })
    })
  }
}