时间戳

首页 > 解决方案 > 为什么我的 png 没有出现在我的桌子上？

javascript - 为什么我的 png 没有出现在我的桌子上？

问题描述

我正在尝试从数据库创建一个表并将其拉到一个网站，到目前为止，我已经成功地提取和显示了文本数据，但是当涉及到图片时，我被卡住了。我使用类中的这个函数将信息从数据库中提取出来：

async all() {
        const sql = 'SELECT Photo, Title, Date_Time FROM articles;'
        const articles = await this.db.all(sql)     
        return articles
}

然后将其传递给路由器：

router.get('/', async ctx => {
    const articles = await new Articles(dbName)
    try {
        const records = await articles.all() //Assigned to the variable records over here
        console.log(records)
        ctx.hbs.records = records
        await ctx.render('newsIn', ctx.hbs)
    } catch(err) {
        ctx.hbs.error = err.message
        await ctx.render('error', ctx.hbs)
    }
})

它重新路由到使用以下 HTML 代码描绘数据的页面：

        <main>
        <table>
        <tr><th>Photo</th><th>Title</th><th>Date</th></tr>
        {{#each records}}
            <tr>
                <td><img src="images/{{this.Photo}}" width="20" height="20"/></td>
                <td>{{this.Title}}</td>
                <td>{{this.Date_Time}}</td>
            </tr>
        {{/each}}
        </table>
        </main>

它甚至提取了正确的信息，甚至是 png 的链接，但它无法描绘图片： 代码创建的表

我知道图片的名称是正确的，因为我打印了控制台记录并且它显示了正确的名称： 控制台日志

有人可以向我解释为什么 PNG 没有显示在桌子上吗？

标签： javascripthtmlsqliteclassget

解决方案

推荐阅读