获取Firestore图像url并显示在图像标签中

Question

我可以获取Firestore数据(文本)并显示在可能的网站上，但我不能显示图像。我以为用身份证可以，但没有。我想我只需要用Firestore数据url

替换图像标签中的src脚本代码

const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
const db = getFirestore(app);
// all home Data
const hero = onSnapshot(doc(db, "pages", "homePage"), (doc) => {
//hero image
var HeroText = doc.data().heroText;
var HeroLink = doc.data().heroLink;
var TabOneImage = doc.data().tabOneImage;
var TabOne = doc.data().tabOne;
var TabTwo = doc.data().tabTwo;
var TabThree = doc.data().tabThree;
document.getElementById("heroText").innerText = HeroText;
document.getElementById("heroLink").innerText = HeroLink;
document.getElementById("tabOneImage").innerText = TabOneImage;
document.getElementById("tabOneName").innerText = TabOne;
document.getElementById("tabTwoName").innerText = TabTwo;
document.getElementById("tabThreeName").innerText = TabThree;
console.log("Current data: ", doc.data());
});

html代码

<img class="article-img"
src="tabOneImage"
alt=" " />

Answer 1

我认为你的HTML应该是:

<img class="article-img"
id="tabOneImage"
alt=" " />

然后你可以设置src属性:

document.getElementById("tabOneImage").src = TabOneImage;