课程名称：SpringBoot2.X + Vue + UniAPP，全栈开发医疗小程序
课程章节：第二章 UNIAPP+Vue3.0+Springboot技术栈分析
课程讲师： 神思者
课程内容：
一、uView组件库
由于UniApp支持多种UI组件库，所以我挑选了uView组件库，集成到了项目中。在package.json文件中。
{
"dependencies": {
"dayjs": "^1.11.4",
"uview-ui": "^2.0.31"
},
"devDependencies": {
"sass": "^1.53.0",
"sass-loader": "^10.3.1"
}
}
在main.js文件中，让UniApp集成该组件库。
//使用uView组件库
import uView from 'uview-ui'
Vue.use(uView)
uView组件库最大的特点就是手册文档比较齐全，每种组件的用法写的很清楚，而且版本定期迭代升级。
二、小程序分包
微信规定小程序打包后的体积不能超过2M。如果小程序页面较多，代码打包体积超过了2M，可以采用分包的形式，把主包的页面拆分到其他分包中，只要每个分包的体积不超过2M，而且小程序打包总体积不超过64M就可以。本课程的小程序项目就采用了分包加载的方式，主包是pages目录，分包是registration、user这些目录。
二、封装Ajax请求
与前端Vue项目类似，小程序项目也定义了全局的Ajax封装函数，在`main.js`文件里面有该函数的声明。
Vue.prototype.ajax = function(url, method, data, fun, load) {
let timer = null
if (load == true || load == undefined) {
uni.showLoading({
title: "执行中"
})
timer = setTimeout(function() {
uni.hideLoading()
}, 60 * 1000)
}
uni.request({
"url": url,
"method": method,
"header": {
token: uni.getStorageSync("token")
},
"data": data,
success: function(resp) {
if (load == true || load == undefined) {
clearTimeout(timer)
uni.hideLoading()
}
if (resp.statusCode == 401) {
uni.showToast({
icon: "error",
title: "请登录小程序"
})
} else if (resp.statusCode == 200 && resp.data.code == 200) {
let data = resp.data
if (data.hasOwnProperty("token")) {
let token = data.token
uni.setStorageSync("token", token)
}
fun(resp)
} else {
uni.showToast({
icon: "none",
title: "执行异常"
})
console.error(resp.data)
}
},
fail: function(error) {
if (load == true || load == undefined) {
clearTimeout(timer)
uni.hideLoading()
}
}
})
}
课程收获：通过视频加文档结合的方式，熟悉了UniApp项目技术栈，期待后续学习！
随时随地看视频
