uni-app開發(fā)中的坑
1.無(wú)法覆蓋uni-app提供的組件的樣式
直接重寫樣式會(huì)發(fā)現(xiàn)并不生效
編譯到H5如果要重置組件樣式使用
>>> .className{
width:xxx
}
scss的話 要使用
/deep/ .uni-radio-input {
width: 32upx;
height: 32upx;
background: #fff !important;
border: 2upx solid #CCCCCC !important;
}
2.ios真機(jī)下鍵盤遮擋住彈框底部部分內(nèi)容
rt

微信圖片_20200528115237.jpg
解決方案
在pages.json中配置
{
"path": "pages/normative-interpretation/normative-interpretation-info/normative-interpretation-info",
"style": {
"app-plus":{
"softinputMode": "adjustResize"
}
}
},
3.uni-app文件上傳&多文件上傳
官網(wǎng)文檔指路:https://uniapp.dcloud.io/api/request/network-file
選擇文件:
uni.chooseImage({
count: 3,
async success(e) {
const res = await handleFileButhUpload(e.tempFilePaths)
if (res) {
const imgUrls = res.data
that.imgUrls = imgUrls
}
},
fail(err) {
uni.showToast({
icon: 'none',
title: '圖片選擇失敗,請(qǐng)稍后重試'
})
}
})
單文件(可附帶傳其他參數(shù))
export const handleUserAvatarUpload = (id, filePath) => {
return new Promise((resolve, reject) => {
uni.uploadFile({
url: BASE_URL + '/community/xfFile/uploadHeadimage',
filePath: filePath, // uni.chooseImage函數(shù)調(diào)用后獲取的本地文件路勁
name: 'file',
formData: {
id
},
success: (res) => {
resolve(res)
},
fail: (err) => {
reject(err)
}
});
})
}
多文件:
我這邊后臺(tái)接口是要我傳files的文件對(duì)象,這東西折騰我大半天,在傳參的時(shí)候碰到過(guò)傳的file為{},后來(lái)我這邊對(duì)選中的文件做了處理。
// 處理選中的文件
export const getFilecalculate = (data) => {
const newData = [];
data.forEach((item, index) => {
newData.push({
name: 'files',
uri: item
})
})
return newData
}
調(diào)用官方api
export const handleFileButhUpload = (filePaths) => {
const files = getFilecalculate(filePaths)
return new Promise((resolve, reject) => {
uni.uploadFile({
url: BASE_URL + '/community/xfFile/uploadImage',
files,
success: (res) => {
const newRes = JSON.parse(res.data)
resolve(newRes)
},
fail: (err) => {
reject(err)
}
});
})
}