首页 文章

Apollo客户端和更新表单

提问于
浏览
0

我想知道是否有人使用Apollo Client和新的查询和变异组件有一个很好的更新表单示例 . 通过更新我的意思是:

  • 使用查询结果填充表单值

  • 编辑输入时更新组件状态(或apollo-link-state?) .

  • 提交时更新状态(或apollo-link-state?)

我现在正在努力解决它,我想知道构建它的最佳方法是什么 . 我应该使用Apollo-link-state来存储表单状态吗?如果没有,我找不到一种方法将查询组件中的道具映射到组件状态对象而不使用查询HOC . 任何例子都会很棒!

谢谢!

1 回答

  • 2

    如果您的应用程序的其他部分不需要访问该状态, apollo-link-state 可能是过度杀伤 - 常规组件状态也可以 . 只需像使用HOC一样创建一个组件:

    class MyComponent extends React.Component {
      constructor (props) {
        super(props)
        this.state = {
          fieldA = props.myQuery.fieldA
          fieldB = props.myQuery.fieldB
        }
    
        render () {
          // your form fields here
        }
      }
    }
    

    你可以这样做:

    <Query>
      {({data, loading})=>(
        if (loading || error) return null
        <MyComponent myQuery={data.myQuery}>
      )}
    </Query>
    

相关问题