Sistemas y Tecnologías Web: Servidor

Master de II. ULL. 1er cuatrimestre. 2020/2021


Organization ULL-MII-SYTWS-2021   Classroom ULL-MII-SYTWS-2021   Campus Virtual SYTWS   Chat Chat   Profesor Casiano

Table of Contents

Descripción de la práctica p15-t3-react-lists-and-conditionals

  1. Introduce an input field inside the App component with a change listener which ouputs in a paragraph the entered text
  2. Introduce a ValidationComponent which receives the lengthof the entered text as a prop.
  3. The ValidationComponent should conditionally output Text too short or Text long enough in a paragraph dpeneding whether the text length is less than or greater than some number, let us say 5.
  4. Create another component CharComponent with a div and style it as a inline box. Here is a suggestion:
    1
    2
    3
    4
    5
    6
    7
    
    {
     display: inline-box;
     padding: 16px;
     text-align: center;
     margin: 16px;
     border: 1px solid black;
    }
    
  5. Inside the Appcomponent render a list of CharComponent, where each CharComponent receives - as a prop - a different letter of the entered text from the initial input field
  6. When you click a CharCompomentit should be removed

References

Comment with GitHub Utterances

Comment with Disqus

thread de discusion