VUE BÁSICO

  1. Ejemplo de reactividad

    {{saludo}}

  2. Ejmeplo de renderizado condicional

    Encedido IF

    Apagado IF

    Encedido SHOW

    Apagado SHOW

  3. Ejemplo de listas
    • {{index}} - {{dia}}
    • {{index}} - {{dia.dia}} : {{dia.abrv}}
  4. Ejemplo de eventos
    • {{index}} - {{tarea}}
  5. Ejemplo de propiedades computadas
    Mensaje original.....
    Mensaje invertido.....
    Mensaje mayusculas.....
    Posición cifrado Cesar
    Mensaje cifrado Cesar [offset Cesar: {{offsetCesar}}].....{{encriptadoCesar}}

    Frutas

    • {{index}} - {{value}}
  6. Ejemplo de filtros
    • {{index}} - {{pelicula}}
    • ({{c}})..... Reverse .....{{c | Reverse }}
      ({{c}})..... Mayusculas .....{{c | Mayusculas }}
  7. Ejemplo de ciclo de vida VUE
    Mira en la consola del navegador para comprobar el ciclo de vida de VUE
  8. Ejemplo de Data Binding en clases y estilos
    Usuarios contraidos
    • {{user.id}}
    • INDEX:{{index+1}}
      • ID:{{user.id}}
      • NAME:{{user.name}}
      • USERNAME:{{user.username}}
      • EMAIL:{{user.email}}
      • ADDRESS
        • STREET:{{user.address.street}}
        • SUITE:{{user.address.suite}}
        • CITY:{{user.address.city}}
        • ZIPCODE:{{user.address.zipcode}}
        • LAT:{{user.address.geo.lat}}
        • LNG:{{user.address.geo.lng}}
      • PHONE:{{user.phone}}
      • WEBSITE:{{user.website}}
        • COMPANY
          • NAME:{{user.company.name}}
        • CATCHPHRASE:{{user.company.catchPhrase}}
        • BS:{{user.company.bs}}
  9. Ejemplo de transiciones
    IF
    ELSE
    TRANSITION
    ANIMATION
    APPEAR
  10. Ejemplo de AJAX Vue-resource
  11. Ejemplo de AXIOS ajax