uni-app开发小程序的完整流程记录

npm init -y //初始化npm项目
npm install @escook/request-miniprogram

// 按需导入 $http 对象
import { $http } from '@escook/request-miniprogram'
//配置网络请求库
$http.baseUrl = '' // 请求根路径
//请求拦截器
$http.beforeRequest = function (options) {
  // 展示loading框
  uni.showLoading({
  	title:'数据加载中...'
  })
}
//响应拦截器
$http.afterRequest = function () {
  // 隐藏加载框
  uni.hideLoading()
}

// 在 uni-app 项目中，可以把 $http 挂载到 uni 顶级对象之上，方便全局调用
uni.$http = $http

1.pages.json配置
  {
	"subPackages": [{
		"root": "subpkg",
		"pages": []
	}],
  }
2.创建目录subpkg
3.在subpkg目录下页面
4.配置页面后会在pages.json中subPackages.pages中自动填写创建的页面信息

const sysInfo = uni.getSystemInfoSync()

uni.setStorageSync('定义参数', 保存的值) //保存
uni.getStorageSync('定义参数')  // 获取

1.使用
    // 调用 uni.previewImage() 方法预览图片
        uni.previewImage({
            // 预览时，默认显示图片的索引
            current: 1,
            // 所有图片 url 地址的数组
    		urls: []
		})

 // 调用 uni.setTabBarBadge() 方法，设置购物车右上角徽标
      uni.setTabBarBadge({
        index: 2,  //位置
        text: 2 + '', // 注意：text 的值必须是字符串，不能是数字，显示的图标
      })

1.新建一个mixins文件夹
2.文件下创建一个.js文件
3.配置内容
export default {
  computed: {},
  methods: {
  },
  data:{
 	 return{
 	 
 	 }
  }
}
4.在需要的vue文件中使用
// 导入自己封装的 mixin 模块
import badgeMix from '@/mixins/xxxx.js'
export default {
  // 将 badgeMix 混入到当前的页面中进行使用
  mixins: [badgeMix],
  // 省略其它代码...
}

// 1. 调用小程序提供的 chooseAddress() 方法，即可使用选择收货地址的功能
//    返回值是一个数组：第 1 项为错误对象；第 2 项为成功之后的收货地址对象
const [err, succ] = await uni.chooseAddress()
// 2. 用户成功的选择了收货地址
if (err === null) {
	// 为 data 里面的收货地址对象赋值
	this.address = succ
}

<uni-number-box :min="1" :value="item.goods_count" :max="9" @change="numChangeHandler"></uni-number-box>

属性
min 最小
max 最大
change 数据发生变化触发
step 一次加多少

// desc 为必填字段，用于声明获取用户个人信息后的用途，不超过30个字符
const [err, res] = await uni.getUserProfile({desc: '完善个人资料'})
// 用户拒绝授权
if (err) return uni.$showMsg('您拒绝授权！')
// 用户同意授权，保存用户信息
console.log(res)

// 调用微信登录接口
 const [err, res] = await uni.login()
// 判断微信登录uni.login()是否调用失败
if (err) return uni.$showMsg('微信登录失败！')
console.log(res.code) // 微信登录返回的code

const [err, succ] = await uni.showModal({
	title: '提示',
	content: '确认退出登录吗？'
})
if (succ && succ.confirm) {
	// 用户确认了退出登录的操作
}

// 调用 uni.requestPayment() 发起微信支付
const [err, succ] = await uni.requestPayment(payInfo)

 // 使用字符串的 replace() 方法，将 webp 的后缀名替换为 jpg 的后缀名
 .replace(/webp/g, 'jpg')

JSON.stringify(对象) === '{}'