Es muy útil poder usar expresiones de JavaScript en las plantillas de Vue.js. Sin embargo, éstas pueden agregarle complejidad innecesaria a nuestro template. Además, en las plantillas estamos limitados a una expresión por valor o interpolación (variable). En casos así, es muy conveniente utilizar las Computed properties, como aprenderemos en esta séptima lección del Curso de Vue.js.

Repositorio

Ver el código de esta lección en GitHub

Notas

  • Para declarar una computed property se coloca en la instancia de Vue.js:
  • Para observar los cambios de una propiedad como alternativa a las computed properties es:
  • Para conocer más a fondo las computed properties como por ejemplo los setter, puedes consultar su documentación oficial.

Actividad

  • Mejora la funcionalidad de nuestro ejemplo para escribir el nombre introducido al revés usando computed properties.
  • Haz que se imprima al lado de los años de experiencia un mensaje indicando su nivel según el número de años:
    • “Experto”, después de 5 años.
    • “Intermedio”, después de 2 años.
    • Principiante, si tiene uno o dos años de experiencias.

Anímate a hacer los ejercicios compártelo a través de los comentarios o haciendo un Pull Request a nuestro repositorio en GitHub

Material relacionado

 

Lección anterior Crear listas con la directiva v-for de Vue.js Lección siguiente Uso y creación de filtros en Vue.js