Question

我正在Firebase Cloudfirestore上工作，我想在带有数据的表列中显示图像。

当前，我尝试使用setattribute来显示图像，但是当我更改为数据集输入时，图像仅显示url。如有需要，可以提供更多信息。

uploadimage.js
var downloadU = "";
 uploadTask.snapshot.ref.getDownloadURL().then(function (downlaodURL) {
            //get your upload image url here...
            downloadU = downlaodURL;
            console.log(downlaodURL);
            document.getElementById('showImg').innerHTML = '<img src="' +  downlaodURL + '" width="50%" height="50%">';
        });

function returnPath()
{
    return downloadU;
}

addinspection.js
let photo = document.createElement('img');
    photo.textContent = doc.data()['photo'];
    photo.setAttribute('src', photo.textContent);

form.addEventListener('submit', (e) => {
    e.preventDefault();
    db.collection('Inspection').add({
        photo : downloadU,
        HazardDiscription : form['HazardDiscription'].value,
        Location : form['Location'].value,
    }).then(() => {
        window.location.href = "addinspection.html";
    })

    form['photo'].value = '';
    form['HazardDiscription'].value = '';
    form['Location'].value = '';

viewinspection.js
function renderTable(doc){ 
dataSet.push([++count, doc.data()['photo'], doc.data()['HazardDiscription'], doc.data()['Location']);
}

db.collection('Inspection').onSnapshot(snapshot => {
    let changes = snapshot.docChanges();
    changes.forEach(change => {
        if(change.type == 'added'){
            renderTable(change.doc);
        } else if (change.type == 'removed'){
            let li = tbody.querySelector('[data-id=' + change.doc.id + ']');
            tbody.removeChild(li);
        }
    })

    $('#dataTable').DataTable({
        data: dataSet
    });
})

预期结果应在列中显示图片而不是网址。

在带有数据的表格列中显示图像

0 个答案: