Uso input type="file" y en lugar de guardar datos en FileData , uso solo un objeto simple y creé un tipo para él: Record<string, File> . Funciona bien, pero cuando trato de crear un validador con zod , no entiendo cómo crear el mismo tipo para él.
El uso:
import { object as zodObject, string, number } from 'zod'; import { useValidators } from '../some'; const useValidation = () => { const { createResolver } = useValidators(); return { resolver: createResolver( zodObject({ name: string(), price: number(), files: ???, }) ), }; };El documento es bastante excesivo, pero no pude encontrar ningún ejemplo para mi caso: https://github.com/colinhacks/zod
El uso de entrada:
const App = () => { const [files, setFiles] = useState<Record<string, File>>({}); return ( <input type="file" onChange={event => { const files = event.target.files; const newFiles: Record<string, File> = {}; const keys = Object.keys(files); for(let i = 0; i < keys.length; i++) { const file = newFiles[key]; newFiles[file.name] = file; } setFiles(newFiles); }} /> ) }¿Quizás z.instanceof pueda resolverlo?
Si desea validar el tipo de archivo...
z.instanceof (File)
O, para el tipo FileList...
z.instanceof (FileList)
zodEsquema:
file: typeof window === "undefined" ? z.string() : record(any()).nullable(),valores iniciales:
file: "undefined",Mi colega ha encontrado la solución:
// useValidation file import { object as zodObject, string, number, record, any } from 'zod'; import { useValidators } from '../some'; const useValidation = () => { const { createResolver } = useValidators(); return { resolver: createResolver( zodObject({ name: string(), price: number(), files: record(any()).nullable(), }) ), }; };Y en el archivo que usa objeto con datos de archivo lo usamos de esta manera:
// fileInput on `onRemove` action return `fileName: string` and my file object looks like this: { fileName: File } const [files, setFiles] = useState<Record<string, File> | null>(null); <FileInput onChange={(fileName) => { const updatedFiles = { ...files as Record<string, File> }; delete updatedFiles[fileName]; setFiles(updatedFiles); }} />