extended-salmon
extended-salmonβ€’16mo ago

Use fieldTransformer

Hey😩 guys can some someone send me an example of how I can use fieldTransformer const handleTransformer = ( field = { key: "size", type: "email" } as InferField ): InferField | false => { return false; }; const SampleList = () => { return ( <AntdInferencer resource="animals" action="list" fieldTransformer={handleTransformer} /> ); }; is not working ! thanks
8 Replies
refine-support-bot
refine-support-botβ€’16mo ago
Hi, I am refine support bot :wave:. I am here to help you with your question. I searched for the answer to your question in the refine documentation and found an answer! πŸ†
Answer: The fieldTransformer prop can be used to modify the inferred fields. It is a function that takes the field as an argument and returns the modified field. If undefined | false | null is returned, the field will be removed from the output, both for the preview and the code. SOURCES: ./docs/packages/documentation/inferencer.md

Note: If this is the answer you need, then we are very lucky. If not, please wait for someone from the refine core team or the community to try to help you.
metropolitan-bronze
metropolitan-bronzeβ€’16mo ago
What's the issue here, can you elaborate a bit more? Guessing from the function's return value (false), it should end up hiding all of the fields from the view πŸ€”
extended-salmon
extended-salmonβ€’16mo ago
Thanks for the reponse all the fields disappeared! I want just to hide 'size' column
metropolitan-bronze
metropolitan-bronzeβ€’16mo ago
We're creating a fields array, (in type InferField[]) and if you pass a fieldTransformer function, we're running fieldTransformer on every field one by one (mapping and also filtering by the response for such cases like false and null) So like, if you want to hide the size column; You can pass a function like this;
const transformer = (field: InferField) => {
if (field.key === "size") {
return false;
}
return field;
}
const transformer = (field: InferField) => {
if (field.key === "size") {
return false;
}
return field;
}
You can just place a console.log(field) at the top of your fieldTransformer function to see what are the fields πŸ˜…
extended-salmon
extended-salmonβ€’16mo ago
Brilliant Thanks a lot It will great if you can put some examples on your website from backend developper like me πŸ˜†
metropolitan-bronze
metropolitan-bronzeβ€’16mo ago
Yeah, this needs an example in docs πŸ˜… Adding this to our backlog and hopefully we'll update the docs with it soon πŸ™
correct-apricot
correct-apricotβ€’16mo ago
hi is there a way to use the fieldTransformer in a headless i component
metropolitan-bronze
metropolitan-bronzeβ€’16mo ago