废弃原因：
Gallery 视图建议使用 Vault Explorer 等插件，性能更佳。不推荐因此入 Dataview 的坑。
实在需要可参考 #44，更加专业规范，适合学习。
1 个赞
感谢分享。然而把不同长宽比的图片混在一起显示还是好难受…我是不是应该想办法把它们都裁剪一下…
发现了一个插件可以实现这样：
但是这个插件好像并不支持dataview吧？
它是另一套体系。我所说的只是它的视觉表现。
感谢你所做的。
我个人其实并没有依赖于Dataview本身更高阶的能力，一直以来只是把它当作一个Gallery的工具在用。具体到应用场景下，我之前其实采用的是把笔记中出现的第一张图片的链接存储到YAML（这些笔记是通过我自己编写的插件生成的，所以可以做到）再通过Dataview展示的方式，相比于Note Gallery，其实更加反直觉了。
这样的写法在移动端好像无法显示图片。有什么解决办法吗？
我刚刚测试了一下，在移动端的预览模式下，[](<>)如果连接到一个http链接，就可以正常显示，如果连接到一篇笔记，就无法显示。
另一方面，即使连接到笔记，在编辑模式下也可以显示。但是，如果是用dataviewjs的话，编辑模式下也无法显示。
[](<${p.file.path}>)，也就是前者。
我知道怎么回事了，我小丑了，对不起，非常抱歉。
我拿沙盒库测试，发现可以正常显示。
一开始我没有使用沙盒库，是因为我已经更换了包括默认主题在内的多个主题，也排除了css片段的影响，至于插件，在移动端与桌面端完全一致。
现在经过排查， konodyuk/obsidian-typing: Programmatic customizations for groups of notes (github.com)这个插件，我在桌面端和移动端的设置不同。
把其React links:preview mode和React links:live preview mode设置关闭即可解决。
这个在移动端应该是没法显示的吧？我在沙盒库试过了
嗨，我想到一个办法，把图片文件读取为二进制数据再进行 base64 编码，这样用基本语法可以在 Dataview 表格中正常使用了，因为用的是基本语法，手机端应该也是可以用的。
但是我不是计算机专业的，不知道读取二进制数据会不会影响性能。想问问你的意见。
嗨。你是否知道这个插件？
我没有做过任何严谨的测试，但是在内容不太多的情况下，将图片数据直接写在文件里貌似不会影响性能。
也许只是需要实际测试一下。
我写了一个版本，效果与你刚更新的dataviewjs完全一致，但是它把配置部分和功能实现分离了，全部放在了Block最开头。
这主要是用来增强可读性。同时，以变成更加用户友好的。
修改也会更方便。ps: emm…是只有我，还是也有其他人，在调整配置时总是会运行失败几次？
// 下面是该Block的全部配置内容
const SourceFolder = "Videos/Animes"; // 数据来源是一个文件夹
const coverFieldName = "cover"; // 想要作为封面展示的yaml 键名
const ItemProperties = {
"封面": "$cover", // $cover会被替换为该Page的cover属性（以图片形式）
"作者": (p) => p.author, // 使用箭头函数，定义项目的每一个属性
"链接": (p) => p.file.link
};
// 配置结束
const pages = dv.pages(`"${SourceFolder}"`).filter((p) => p[coverFieldName]);
const Path2Base64 = async (cover) => {
if (cover.path) {
const localImg = await app.vault.getAbstractFileByPath(cover.path);
const buffer = await app.vault.readBinary(localImg);
const base64 = obsidian.arrayBufferToBase64(buffer);
return `data:image;base64,${base64}`;
}
return cover;
};
const generateCoverLink = (cover, filePath) =>
`[](<${filePath}>)`;
Promise.all(
pages.map(async (page) => {
const cover = await Path2Base64(page[coverFieldName]);
return Object.values(ItemProperties).map((value) =>
value === "$cover" ? generateCoverLink(cover, page.file.path) : value(page)
);
})
).then((tdata) => dv.table(Object.keys(ItemProperties), tdata));
