dataview视图模式无法显示图片？

疑问解答
1

遇到的问题

跟着这个教程建立的离线数据库 :black_joker: Obsidian 建立卡片數據庫

2条原始数据之一是这么写的：

---
游戏名:路易吉洋馆3
封面:![[路易吉洋馆3.jpg]]
购入日期:2022-11-03 周四
豆瓣:"https://www.douban.com/game/30325261/"
豆瓣评分:"8.8"
---

汇总生成卡片视图的页面代码是这么写的：

---
cssClasses: cards
---
```dataviewjs0426
let pages = dv.pages('"myself/游戏"')
	.sort(p => p.购入日期, 'desc');
// Create table
dv.table(["封面","游戏名","公司","购入日期","个人评分"],
	 pages.map(p => [`<img class="myTableImg" src="${app.vault.adapter.getResourcePath("Obsidian素材/Files/" + p.封面)}">`,
	 ("**[[" + p.file.name + "|" + p.游戏名 + "]] (" + p.年份 + ")** / " + p.平台),
	 ("公司：" + p.公司),
	 ("购入日期：" + p.购入日期),
	 ("个人评分：" + p.个人评分)
	 ]));
    ```

接下来是张图片说明，因为新人发帖只能上传1张图片…麻烦大家打开放大看一下

image
image713×2534 154 KB

2

请参考如下： 主要是路径不全引发的问题
问题1：
Obsidian素材/Files/ 而不是 ：Obsidian素材/Files；少了一层路径；
问题2：
dataview 这个控件我不熟悉，
但是 p.封面，我发现的示例中obsidian 也不识别，所以应该是这个问题
我换了写法 ：+ p.file.name + “.jpg”)}">`,

let pages = dv.pages('"badcase/myself/游戏"').sort(p => p.购入日期, 'desc');
// Create table
dv.table(["封面","游戏名","公司","购入日期","个人评分"],
	 pages.map(p => [`<img src="${app.vault.adapter.getResourcePath("badcase/Obsidian素材/Files/" + p.file.name + ".jpg")}">`,
	 ("**[[" + p.file.name + "|" + p.游戏名 + "]] (" + p.年份 + ")** / " + p.平台),
	 ("公司：" + p.公司),
	 ("购入日期：" + p.购入日期),
	 ("个人评分：" + p.个人评分)
	 ]));

最后的效果

image
image1508×281 73.9 KB

3

非常感谢，我今天换台电脑重新试了一下，原代码和你的代码都生效了，直接使用的dataview最新版本，晚上再回去检查一下有问题的电脑环境到底是什么情况…
另外，我也理解为什么会展示2遍数据了，因为我yaml里也有重复的字段和数据…把字段名区分开就可以了

4

你也可以考虑 yaml 区域纳入 banner 或者在 具体页面放入 cover 字段，链接对应。这样封面直接可以调用了

5

图片改用<img=“”>这种格式也可以显示,可以参考dataview图片显示问题

6

请问lz的游戏信息是手动输入的吗，还是用脚本自动导入呢？目前豆瓣读书和影视都有大佬做了自动导入信息的脚本，可是游戏好像还没有人做

7

手动输入的，豆瓣也有游戏词条，但只有个基本信息，而且游戏封面也不高清

8

谢谢，我也打算手动录入了