Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

146
Vistas
Crear árbol Antd basado en el nodo marcado de otro árbol Antd

Quiero crear un árbol y datos con solo nodos marcados de otros datos del árbol, por favor mire aquí la imagen

Cuando verifico algunos nodos y hago clic en validar, quiero poder filtrar solo los datos verificados/a medias de mis datos y crear otro árbol con datos nuevos. Esta es mi caja de arena, échale un vistazo :) https://codesandbox.io/s/modern-browser-glh4n?file=/index.js

Ejemplo con imágenes: cuando reviso este nodo y hago clic en validar: imagen cuando selecciono nodos , espero obtener este resultado: resultado esperado Gracias

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Creé un método recursivo para crear nuevos datos de árbol basados en nodos de árbol marcados y medio marcados, en realidad filtra el árbol original con su subárbol.

aquí está el codesandbox actualizado:

 const createNewTreeData = (treeData, checkedKeys) => { return treeData.reduce((acc, treeDataItem) => { if (checkedKeys.includes(treeDataItem.key)) { if (treeDataItem.children) { acc.push({ ...treeDataItem, children: createNewTreeData(treeDataItem.children, checkedKeys) }); } else { acc.push(treeDataItem); } } return acc; }, []); };

Y en el evento onCheck, agregué nodos semimarcados al estado allChecked de esta manera:

 onCheck = (checkedKeys, e) => { const allCheckedKeys = [...checkedKeys, ...e.halfCheckedKeys]; this.setState((prevState) => ({ ...prevState, allCheckedKeys, checkedKeys })); };
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda