如何在Sanity Studio中显示对象架构字段拼接内容而非最后一项

你遇到的问题是因为Sanity Studio默认只展示数组对象的最后一个字段作为预览项。要实现多字段拼接显示，只需给数组内的object类型添加自定义预览配置即可。

修改后的完整Schema配置 #

defineField({
    title: 'Ingredients',
    name: 'ingredients',
    type: 'array',
    of: [
        {
            type: 'object',
            fields: [
                {
                    name: 'ingredient',
                    title: 'Ingredient', // 修正原拼写错误
                    type: 'reference',
                    to: [{ type: 'ingredient' }],
                    validation: Rule => Rule.required().error('Ingredient is required.')
                },
                defineField({
                    title: 'Amount',
                    name: 'amount',
                    type: 'number',
                    validation: Rule => Rule.required().error('Amount is required.')
                }),
                defineField({
                    title: 'Unit',
                    name: 'unit',
                    type: 'string',
                    options: { list: [...] }
                })
            ],
            // 新增预览配置，拼接字段内容
            preview: {
                select: {
                    // 提取引用文档的title字段（需对应你的ingredient schema中的标题字段）
                    ingredientName: 'ingredient.title',
                    amount: 'amount',
                    unit: 'unit'
                },
                prepare(selected) {
                    const { ingredientName, amount, unit } = selected;
                    // 自定义拼接格式，示例："500ml 牛奶"
                    return {
                        title: `${amount}${unit ? ' ' + unit : ''} ${ingredientName}`
                    };
                }
            }
        }
    ]
}),

关键说明 #

1. preview.select：指定需要提取的字段，对于reference类型，通过字段名.目标字段的方式获取引用文档的内容（这里假设你的ingredient schema有title字段存储食材名称，若字段名不同请自行修改）。
2. preview.prepare：将提取到的字段拼接成预览标题，你可以根据需求调整格式（比如调整顺序、添加分隔符等）。
3. 顺便修正了原配置中title: 'Indredient'的拼写错误，避免后续混淆。

内容的提问来源于stack exchange，提问作者Omar.Ebrahim