0
1K
VistasCómo eliminar un archivo en el componente de carga de antd
Tengo este componente de carga que obtuve de antd: documentación de diseño de react ant
<Upload beforeUpload={()=> { return false; }} onChange={e => onChangeFile(e, index)} onRemove={e => onRemoveFile(e, index)} > <Button icon={<UploadOutlined />} > Upload a file </Button> </Upload>Después de cargar el archivo, aparece un icono de eliminación. Cuando hago clic en el botón Eliminar, el archivo no se elimina del estado.
aquí está la función onChange:
const onChangeFile = (info, index) => { console.log("onChange info = " + info); const newForm = form; newForm.inputs[index].value = info.file; setForm({ ...form, from: newForm }); console.log("onChange form = " + form); };Intenté eliminarlo usando la función onRemove como esta:
const onRemoveFile = (info, index) => { console.log("onRemove info = " + info); const newForm = form; newForm.inputs[index].value = null; setForm({ ...form, from: newForm }); console.log("onRemove form = " + form); };la salida de los registros de la consola:
captura de pantalla de la interfaz de usuario:
no dude en probar algunas cosas en este ejemplo de código proporcionado por antd:
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Puedes lograrlo siguiendo este ejemplo:
const normFile = (e) => { if (Array.isArray(e)) { return e; } return e && e.fileList; }; <Form onFinish={() => {}}> <Form.Item name="tagList" label="Upload" valuePropName="list" getValueFromEvent={normFile} rules={[ { required: true, message: 'Tag list is required', }, ]} > <Upload beforeUpload={() => false} listType="picture-card" > <UploadOutlined style={{ marginRight: 5 }} /> Upload </Upload> </Form.Item> </Form>
·
Juan Pablo Isaza
Denunciar
Responde la pregunta