uni-app開發(fā)踩坑集合(會(huì)持續(xù)更新)

uni-app官網(wǎng)指路

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)
            }
        });
    })
}
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

友情鏈接更多精彩內(nèi)容