Javascript 为什么不'；t我的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>

光滴定酸盐
{{{#每个记录}
{{this.Title}}
{{this.Date\u Time}
{{/每个}}

它甚至从png的链接中提取正确的信息，但无法描绘图片：

我知道图片的名称是正确的，因为我打印了console记录，它显示了正确的名称：

有人能解释一下为什么PNG没有出现在桌子上吗