app项目+uniapp+uni-ui

1、项目的创建

新建------>项目

uni-app----->填写项目的名称---------- >uni-ui框架------->vue版本2.0-------> 点击创建即可

 

2、配置tabBar列表

打开根目录下的page.js

 3.二次封装uniapp的网络请求

 根目录下新建api文件夹

新建base.js和request.js

base .js请求接口

 request来封装网络请求

/* 
	封装的网络请求的方法
		url 接口地址
		method 请求方式
		data 参数传递
		options 配置参数
			{
				loading:boolean, 是否加载动画
				title:'名称'
				
			}
 */
import base from './base.js'

export default function (url,method = 'POST', data = {}) {//options={loading:true,title:'',isShow:}

	return new Promise((resolve, reject) => {
		// //交互动画
		// if (options.loading) {
		// 	uni.showLoading({
		// 		title: "数据加载中"
		// 	})
		// }
		uni.request({
			url: base.host + url,
			method,
			data,
			success: res => {
				// if (res.data.status === 200) {
				// 	if (options.isShow) {
				// 		uni.showToast({
				// 			title: options.title || "数据加载完毕"
				// 		})
				// 	}

				// }
				resolve(res.data)
			},
			fail: error => {
				//信息提示--请求失败
				reject(error)
			},
			complete() {
				//成功或者失败都执行
				uni.hideLoading()
			}
		})
	})

}

4.新建仓库store

在仓库中做数据持久化，下载安装插件vuex-persistedstate

在uniapp中格式需要修改，使用getStorageSync