项目场景：

在利用taro进行多端开发时踩坑随记：

---

问题描述

在编译h5端的时候提示：
Uncaught TypeError: (prevProps.className || prevProps.class || “”).split is not a function"

return <ScrollView scrollY onScrollToLower={this.onScrollToLower} onRefresherRefresh={this.onRefresherRefresh} 
refresherTriggered={this.props.refresherTriggered} refresherEnabled={this.props.refresherEnabled} 
className={['app-tab-content',this.props.tabValue === this.props.name ? 'app-tab-content-show' : null]}>
{this.props.children}</ScrollView>

---

原因分析：

类名里出现了空字符串

---

解决方案：

  return <ScrollView scrollY onScrollToLower={this.onScrollToLower} onRefresherRefresh={this.onRefresherRefresh}refresherTriggered={this.props.refresherTriggered} refresherEnabled={this.props.refresherEnabled}className={`app-tab-content ${this.props.tabValue === this.props.name && 'app-tab-content-show'}`}>{this.props.children}</ScrollView>

问题描述

scrollview标签在h5端不能滑动，但是刷新页面就能滑动了

---

原因分析：

ScrollView标签上设置了overflow:hidden属性

---

解决方案：

去掉overflow:hidden属性

问题描述

提示：这里描述项目中遇到的问题：

小程序调用Taro.chooseImage和H5端不同，h5端上传给后端报错

---

原因分析：

利用Taro.chooseImage上传图片之后上传给后端小程序和h5端返回的tempFilePaths不同
小程序：

h5端：

---

解决方案：

在小程序和h5的时候采用不同的方法传：

  const handleUploadImage = () => {Taro.chooseImage({count: 1,sizeType: ['compressed'],sourceType: ['album', 'camera'],success: async (res) => {const tempFilePath = res.tempFilePaths[0];uploadImageToServer(tempFilePath,res.tempFiles[0])let urlList = [...list]urlList.push(tempFilePath)setList(urlList)}});};const uploadImageToServer = async (filePath) => {let token = Taro.getStorageSync("token");const res = await Taro.uploadFile({url: api.xxxx,filePath:filePath,name: 'file',formData: {},header: {'X-Authorization': `Bearer ${token}`,'Content-Type': 'multipart/form-data', // 如果上传文件需要特定的 Content-Type，可以在这里设置},});if(process.env.TARO_ENV==="weapp"){const res = await Taro.uploadFile({url: api.xxx,filePath:filePath,name: 'file',formData: {},header: {'X-Authorization': `Bearer ${token}`,'Content-Type': 'multipart/form-data', // 如果上传文件需要特定的 Content-Type，可以在这里设置},});let parse = JSON.parse(res.data)setKeyKList([...keyKList, parse.data])}else if(process.env.TARO_ENV==="h5"){// h5返回得地址转换为blobfetch(filePath).then(fetchRes => {return fetchRes.blob();}).then(async data => {//blob格式转换为base64格式blobToDataURI(data,async function ( result) {let res = await request.post({url: api.uploadBase,data: {base64Str:result,fileExt:baseFile.originalFileObj.name}});let parse = JSON.parse(res.data)setKeyKList([...keyKList, parse.data])});})}};const blobToDataURI=(blob, callback) =>{let reader = new FileReader();reader.readAsDataURL(blob);reader.onload = function (e) {callback(e.target.result)}}

附上几种图片格式转换（File、Blob、base64）方法