Wix Database Collection可选图片与同模块数据同条存储问题

两个问题的核心都是异步逻辑处理错误：

• startUpload() 是异步Promise方法，直接把方法返回的Promise对象赋值给fileNecessari1字段时，数据库拿到的不是可识别的图片URL，是未执行完成的异步对象，字段赋值自然失效
• 注释块里的写法是等单张图片上传完成后，单独调用一次保存接口，且仅传入了图片字段，其余表单数据完全没带上，必然会生成独立的新数据行，无法和其他表单数据合并。

核心规则：所有图片先全部上传完成拿到有效URL，再把URL和其余表单字段拼成完整的单条数据对象，最后只调用一次保存接口写入数据库，就能保证所有内容存在同一条记录里。
针对可选上传的场景（用户可选择传0/1/多张图），处理流程：

1. 遍历所有上传按钮，用户选了文件的就把对应上传任务加入任务队列，没选的直接跳过
2. 用Promise.all等待队列里所有上传任务执行完成，拿到全部图片的访问URL
3. 把URL和其余表单字段组装成完整的数据对象
4. 单次调用后端保存接口完成写入，写入成功后再执行页面跳转等后续逻辑

import wixData from 'wix-data';
import wixLocation from 'wix-location';
import {addOrderInfoVideo} from 'backend/creazioneVideoAdClassico'

export async function button4_click(event) {
    // 先做必填项校验
    if ($w('#input2').value === "") {
        const textError = "Inserisci la mail con la quale hai effettuato l'ordine"
        $w('#text133').text = textError
        $w('#text133').text.bold()
        return
    }

    // 收集所有待执行的图片上传任务
    const uploadTasks = []
    if ($w('#uploadButton4').value.length > 0) {
        uploadTasks.push($w('#uploadButton4').startUpload())
    }
    if ($w('#uploadButton5').value.length > 0) {
        uploadTasks.push($w('#uploadButton5').startUpload())
    }

    // 等待所有图片上传完成，按加入队列的顺序返回上传结果
    const uploadResults = await Promise.all(uploadTasks)
    // 按顺序取对应图片的URL，用户没传图的字段赋值为null即可
    const fileNecessari1 = uploadResults[0]?.url || null
    // 如果第二个上传按钮对应单独的数据库字段，解开下方注释即可
    // const fileNecessari2 = uploadResults[1]?.url || null

    // 组装完整的单条记录数据
    const nuovoOrdine = {
        'fileNecessari1': fileNecessari1,
        // 'fileNecessari2': fileNecessari2,
        'puntiDiForza': $w('#textBox1').value,
        'numeroOrdine': $w('#input2').value,
        'colori': $w('#textBox2').value,
        'idea': $w('#textBox3').value,
        'link': $w('#input3').value,
        'nomeProdotto': $w('#textBox3DAC315').value,
        'concorrenza': $w('#textBox3DAC315DAC326').value,
        'contatti': $w('#input1').value,
        'dettagliExtra': $w('#textBox4').value,
        'slider1': $w('#slider1').value,
        'slider2': $w('#slider2').value,
        'slider3': $w('#slider3').value,
        'slider4': $w('#slider4').value,
        'slider5': $w('#slider5').value,
        'slider6': $w('#slider6').value,
        'slider7': $w('#slider7').value,
        'slider8': $w('#slider8').value,
        'slider9': $w('#slider9').value,
        'slider10': $w('#slider10').value,
        'slider11': $w('#slider11').value,
        'slider12': $w('#slider12').value,
        'slider13': $w('#slider13').value
    }

    // 单次调用保存接口，所有字段写入同一条记录
    await addOrderInfoVideo(nuovoOrdine)

    // 确认保存完成后再跳转，避免请求被中断导致数据丢失
    wixLocation.to('https://www.mywebsite.it/ringraziamenti-video-ads')
}

• 禁止在单个图片上传的回调里单独调用保存接口，否则必然生成独立数据行
• 图片字段必须拿到上传完成后返回的URL字符串再赋值，不能直接传入未执行完的Promise对象
• 可选图片字段用户未上传时直接传null即可，Wix数据库支持可选媒体字段为空
• 页面跳转、提示成功等逻辑必须放在保存接口执行完成之后，否则页面卸载会中断未完成的上传、保存请求。

内容的提问来源于stack exchange，提问作者alch_coder