Accessing parent schema values in custom input components changed, resolved with withParent HOC or useFormValue hook.
12 repliesLast 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 ?
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 MyCustomInputimport 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 MyCustomInputdocument and/or parent are still undefined in props if I console.log it
@sanity/cli version 2.35.0
Any suggestion ? That’s very weird because this way to access parent schema was ok before...
https://www.sanity.io/schemas/custom-input-component-with-webhook-8e9ec23a It’s exactly what this guy does to access parent document data no ?
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'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 ?
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
useFormValuehook.
Thanks again for your answer user M !
This question/answer is super helpful. user M can you please point me in the direction of the docs for using the
useFormValuehook?
Nvmd, found this! https://www.sanity.io/docs/migration-cheat-sheet#76d45626ec04
Was this answer helpful?
Sanity – Build the way you think, not the way your CMS thinks
Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.
