1、uniapp做微信小程序，内嵌H5进行支付
其本质是这样的，在微信小程序种，用web-view嵌入H5页面，然后通过web-view的url对H5进行传参，H5传参后可以做一些处理，然后再把参数传给小程序进行支付
//uniapp小程序
<template>
<view >
//就是http://192.168.22.199:8081/#/?userId=18100000001&code=xxxxx&type=mini
<web-view :src="url + '?userId=' + userId + '&code=' + code + '&type=mini'"></web-view>
</view>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
const url = ref('http://192.168.22.199:8081/#/')
const code = ref('')
const userId = ref('18100000001')
onLoad(async () => {
//初始化在小程序中拿到code
await loginGetCode()
})
const loginGetCode = async () => {
await uni.login({
provider: 'weixin',
success: loginRes => {
code.value = loginRes.code
console.log(code.value)
},
})
}
</script>
然后在H5的http://192.168.22.199:8081/#/?userId=18100000001&code=xxxxx&type=mini页面，对url解析或者保存判断啥的，就表明这个是小程序内嵌的H5
WechatMiniProgramPay(){
//jWeixin是uniapp帮做的了，判断是否有jWeixin，有就跳转小程序支付
if (jWeixin){
//redirectTo替代
jWeixin.miniProgram.navigateTo({
appId:'wx126ae2069f831xxx',
//在url后面配置支付参数
//就跳到了小程序的这个页面，后面带参数
url:`/pages/index/H5ToWechatMiniPay?name=qiang`,
envVersion:'develop', //develop,trial,release（开发，体验，正式）
success(res) {
console.log(res,'跳转成功')
},
fail(res){
console.log(res,'跳转失败')
}
})
}else{
return Toast.fail('跳转失败，不允许支付')
}
}
//小程序
<template>
<view>
<button @click="weChatMiniProgramPay">微信支付</button>
</view>
</template>
<script setup>
import { onLoad } from '@dcloudio/uni-app'
onLoad(options => {
console.log('H5跳到小程序')
//这里可以拿到传参，可以配置支付参数
console.log(options)
})
//demo，支付是这样支付的，大概，但具体的支付参数个人还是觉得后端传过来是安全的
const weChatMiniProgramPay = () => {
uni.requestPayment({
provider: 'wxpay',
timeStamp: String(Date.now()),
nonceStr: 'A1B2C3D4E5',
package: 'prepay_id=wx20180101abcdefg',
signType: 'MD5',
paySign: '',
success: function (res) {
console.log('success:' + JSON.stringify(res))
},
fail: function (err) {
console.log('fail:' + JSON.stringify(err))
},
})
}
</script>
<style lang="scss" scoped></style>
2、在uniapp中嵌入webview（H5），webview（H5）向uniapp发送通讯
其实这个是上一个问题的另一种方式。这种方式是我偶然在官网看到的，文档：https://ask.dcloud.net.cn/article/35083
先在H5(项目的public/index.html)导入
<!-- 微信 JS-SDK 如果不需要兼容小程序，则无需引用此 JS 文件。 -->
<script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<!-- uni 的 SDK，必须引用。 -->
<script type="text/javascript" src="//js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.0.1.52.js"></script>
<script>
//开启uniapp通讯
document.addEventListener('UniAppJSBridgeReady', function() {
uni.getEnv(function(res) {
console.log('当前环境：' + JSON.stringify(res));
});
});
</script>
在uniapp中可以这样写
<template>
<view class="content">
<web-view :src="xxxxxxxx" @message="handleMessage"></web-view>
</view>
</template>
<script setup lang="ts">
//接受webview(H5)向uniapp发送的通讯
const handleMessage = (evt: any) => {
console.log(JSON.stringify(evt.detail.data))
}
</script>
最后在webview写触发的事件
const param = {
name:'qiang'
}
uni.postMessage({
data: {
action: 'postMessage',
param
}
});
这样子，以后都可以在@message="handleMessage"里写东西了
（但是偶尔可以偶尔不可以，我都不知道是啥回事）
3、uniapp版本的echarts：ucharts
https://www.ucharts.cn/v2/#/
uniapp的npm使用方式起来，挺过分的，
首先npm i @qiun/uni-ucharts
然后再根据这个仓库的提示来手动添加文件
https://gitee.com/uCharts/uCharts/tree/master/uni-app/uCharts-%E7%BB%84%E4%BB%B6/qiun-data-charts(%E9%9D%9Euni_modules)
1、请将static目录下文件复制到根目录的static文件夹下
2、qiun-title-bar文件夹可删除
3、test-charts文件夹可删除
4、uni-datetime-picker文件夹可删除
5、其他的都不要动，直接原样复制到您项目中的components目录
就真的是npm i @qiun/uni-ucharts后，再手动下载这个git仓库，找到这个组件内的东西，再根据提示来手动添加一些文件，就可以用了（就离谱）
4、uni.request返回的状态码
其实，这个请求，只要能发送并且返回状态码，都是走success函数和try里面的，不会走fail或catch。
那么，我们就需要判断状态码
try {
// uni.request请求中，就算状态码返回403之类的，他也是走success的，也就是说不会走到catch或者fail()，需要手动去写
let res = await uni.request(option)
// 返回非200，服务器报错
if (res.statusCode !== 200) {
xxxxx
}
} catch (error) {
xxxx
}
5、断言：强制类型
就比如，一个函数返回是某个类型，那么我们可以用断言来进行强制状态
//as xxxx，强制转换
const data = res.data as RequestResult<T>
