Firebase Firestore获取文档字段如何固定'All'字段排在首位

你之前尝试的orderBy、orderByChild、startAt都不生效的核心原因是：这些API都是用于对集合下的多个文档做排序，而你当前是读取单个文档的内容，Firestore不会保证返回的单文档对象内部字段的排列顺序，同时JS原生Object.keys()遍历普通对象的键顺序也不做强保证，所以每次刷新拿到的键顺序随机是正常现象，不需要在查询层面做调整，前端拿到数据后手动处理键顺序即可。

你的需求只需要保证All在第一位，其余字段顺序无要求，只需要修改渲染时遍历的键数组，手动把All放到首位即可，不需要修改数据获取逻辑：

• 找到渲染分类按钮的代码块，把原来直接遍历Object.keys(category)的逻辑替换为处理过顺序的数组

原代码：

<div className='center'>
  {Object.keys(category).map((key) => (
    sortButton(key) 
  ))}
</div>

修改后：

<div className='center'>
  {['All', ...Object.keys(category).filter(key => key !== 'All')].map((key) => (
    sortButton(key) 
  ))}
</div>

这段逻辑的作用是：先固定第一位为All，再把原对象里除了All之外的所有键拼接到后面，完全满足All始终在首位的需求，改动量最小。

如果你后续需要让其余分类也按固定顺序展示（比如API→Blockchain→Database的固定顺序），可以直接自定义排序数组，过滤掉不存在的字段后遍历即可：

// 按你需要的展示顺序定义数组
const CATEGORY_ORDER = ['All', 'API', 'Blockchain', 'Database', 'Web']
<div className='center'>
  {CATEGORY_ORDER
    .filter(key => Object.prototype.hasOwnProperty.call(category, key))
    .map((key) => sortButton(key))
  }
</div>

注意：永远不要依赖JS对象的原生键遍历顺序做UI排序，所有需要固定展示顺序的场景，手动维护排序数组是最稳定、兼容性最好的方案。

内容的提问来源于stack exchange，提问作者millbird