Draggable List

Una lista de elementos arrastrables que pueden ser reordenados por los estudiantes.

Opciones

data | array (required): una serie de objetos con claves de identificación y de texto. Default: none.
onChange | function: llamada de retorno invocada con un conjunto de datos recién ordenados en cada cambio. Default: onChange(){}.
onInit | function: función de llamada de retorno invocada después del montaje del componente. Default: onInit(){}.
shuffle | boolean: controla si los elementos de datos deben mezclarse en la presentación inicial. Default: false.
disabled | boolean: controla si los elementos pueden ser arrastrados o no. Default: false.
className | string: nombre de la clase. Default: ''.
style | object: Estilos en línea CSS. Default: {}.

Ejemplos

Editor en vivo

<DraggableList
    data={[
        { id: 0, text: "Compact" },
        { id: 1, text: "Large" },
        { id: 2, text: "Midsize" },
        { id: 3, text: "Small" }
    ]}
/>

<DraggableList
    data={[
        { id: 0, text: "Compact" },
        { id: 1, text: "Large" },
        { id: 2, text: "Midsize" },
        { id: 3, text: "Small" }
    ]}
/>

Resultado

ReferenceError: Provider is not defined

Opciones​

Ejemplos​

Opciones

Ejemplos