如何创建可以处理查询的自定义 netlifyCMS 小部件？

Question

所以我想要一个 select 小部件，其中的选项基于我必须查询的一些动态数据。但是，自定义小部件似乎在导入 useStaticQuery 时中断。

下面显示“CMS 中没有控件小部件”。它在没有 useStaticQuery 导入的情况下工作正常。

import React from 'react';

import { useStaticQuery, graphql } from "gatsby"

export class CustomControl extends React.Component {

  render() {
      return (
        <div>
          ...
        </div>
      )
  };
}


export const CustomPreview = (props) => {
  return (
    <div></div>
  );
}

一般来说，是否有最好的 way/practice 来创建可以处理动态值的自定义小部件？

更新：

我试过关系小部件，但没有成功。我在集合中有现有数据，但似乎无法从小部件访问它。有人有我可以使用的工作版本吗？

作为“数据”的集合：

  - label: Team
    name: team
    folder: 'src/pages/team' 
    create: true
    fields:
      - {label: 'Name', name: 'name', widget: string}

和关系小部件：

 - label: 'Relation widget'
   name: 'relationWidget'
   widget: 'relation'
   collection: 'team'
   searchFields: ['name']
   valueField: 'name'
   displayFields: ['name']

Answer 1

使用 NetlifyCMS 结构，访问其他数据的最佳方式是通过关系小部件而不是查询。

但是，为了真正看到这个工作，该网站需要上线。您不能在本地模拟数据。意思是，您无法转到 localhost:8000/admin 并查看关系小部件拉取任何内容。

（这有点麻烦，因为您还必须对用户进行身份验证并重建整个站点才能看到一个更改。看起来您应该能够查询或只是运行 CMS 在本地并以这种方式乱搞）

更新

为了通过关系小部件传递多个值： value_field：“{{value1}}-{{value2}}”

在本地创建运行 CMS 的代理服务器。这对于 netlifyCMS 目前仍处于测试阶段，但似乎运行良好。 https://www.netlifycms.org/docs/beta-features/

如何创建可以处理查询的自定义 netlifyCMS 小部件？

How to create custom netlifyCMS widget that can handle a query?

reactjs

graphql

gatsby

netlify

netlify-cms