Skip to content
Get help on Slack

Accessing parent schema values in custom input components changed, resolved with withParent HOC or useFormValue hook.

12 replies
Last updated: Jan 12, 2023
Hello Sanity community ! I’ve made some custom input components, which were working well until now. But now when I try to access to parent document schemas types and values by props in these custom input components , parent key in props remains undefined ( that was not the case before ). Something has changed in the way to get access to parent document schema values ?
Jan 3, 2023, 2:04 PM
import React from 'react'
export const MyCustomInput = React.forwardRef((props, ref) => {
  const { parent } = props

  // Access the parent schema values
  const parentValue1 = parent.parentValue1
  const parentValue2 = parent.parentValue2

  // render the input component
  return (
    <div>
      <input type="text" />
    </div>
  )
}

export default MyCustomInput
Jan 3, 2023, 2:56 PM
import React from 'react'

export const MyCustomInput = React.forwardRef((props, ref) => {
  const { document } = props

  // Access the parent schema values
  const parentValue1 = document.parentValue1
  const parentValue2 = document.parentValue2

  // render the input component
  return (
    <div>
      <input type="text" />
    </div>
  )
}

export default MyCustomInput
Jan 3, 2023, 2:56 PM
document and/or parent are still undefined in props if I console.log it
Jan 3, 2023, 2:57 PM
@sanity/cli version 2.35.0
Jan 3, 2023, 3:12 PM
Any suggestion ? That’s very weird because this way to access parent schema was ok before...
Jan 3, 2023, 5:18 PM
https://www.sanity.io/schemas/custom-input-component-with-webhook-8e9ec23a It’s exactly what this guy does to access parent document data no ?
Jan 3, 2023, 5:29 PM
The API changed here a month or two ago. You can now access it by wrapping the component in a withParent HOC.
import {withParent} from 'part:@sanity/form-builder'
Jan 3, 2023, 7:18 PM
Hello
user M
, thanks a lot for your answer ! I managed to solve my issue by using your suggestion with High Order Component withParent/withDocument from ‘part:@sanity/form-builder’. But honestly, I searched hard to find how this can be used. I didn’t found many working examples neither documentation that explains that change nor how to use it. Perhaps I didn’t go deep enough in every results of my search, but what I mean is that, I guess, it is poorly referenced. 2 questions so : have you some links/docs to share that explain that change and how to use it ? And, is this “New way” to use custom input components concerns also Sanity V3 ?
Jan 4, 2023, 8:14 AM
Since that version is now considered deprecated, it's definitely not as obvious in the docs where these are. The withDocument and withParent HOCs have been in use for about 3 or 4 months prior to the release of V3. In V3, you'll use a 
useFormValue
hook.
Jan 4, 2023, 4:42 PM
Thanks again for your answer
user M
!
Jan 5, 2023, 8:10 AM
This question/answer is super helpful.
user M
can you please point me in the direction of the docs for using the 
useFormValue
hook?
Jan 12, 2023, 5:44 PM
Jan 12, 2023, 6:01 PM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Get started for freeExplore the demo

Was this answer helpful?