Expresiones

En realidad el tema de esta clase no son expresiones, en Vue son llamadas Interpolaciones, donde dentro de estas dobles llaves pueden haber expresiones de Javascript

https://vuejs.org/v2/guide/syntax.html#Interpolations

Tal vez en su momento pug fue bueno pero ya es hora de actualizar el tutorial, porque no da ganas de revisar esto

Esto lo vimos en el curso básico, dentro de las expresiones puedes poner cualquier código JavaScript válido, exceptuando las estructuras de control

Cuando agrego el codigo input(v-model='name'), me devuelve el siguiente error:

Failed to compile.

./node_modules/vue-loader/lib/template-compiler?{“id”:“data-v-7ba5bd90”,“hasScoped”:false,“buble”:{“transforms”:{}}}!./node_modules/vue-loader/lib/template-compiler/preprocessor.js?engine=pug!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./src/App.vue
Module build failed: SyntaxError: Unexpected token, expected “,” (1:347)

1 | var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c(‘div’,{attrs:{“id”:“app”}},[_c(‘input’,{directives:[{name:“model”,rawName:“v-model”,value:(_vm.name),expression:“name”}],domProps:{“value”😦_vm.name)},on:{“input”:function($event){if($event.target.composing){ return;_vm.name=$event.target.value}}}),_c(‘p’,[_vm._v(_vm._s(_vm.name))]),_c(‘a’,{attrs:{“href”:_vm.url}},[_vm._v(“Link”)])])}
| ^
2 | var staticRenderFns = []
3 |
at t (/opt/lampp/htdocs/Platzi/vueavance/platzimusic/node_modules/prettier/parser-babylon.js:1:326)
at Object.parse (/opt/lampp/htdocs/Platzi/vueavance/platzimusic/node_modules/prettier/parser-babylon.js:1:208490)
at Object.parse$2 [as parse] (/opt/lampp/htdocs/Platzi/vueavance/platzimusic/node_modules/prettier/index.js:10639:19)
at coreFormat (/opt/lampp/htdocs/Platzi/vueavance/platzimusic/node_modules/prettier/index.js:13856:23)
at format (/opt/lampp/htdocs/Platzi/vueavance/platzimusic/node_modules/prettier/index.js:14115:73)
at formatWithCursor (/opt/lampp/htdocs/Platzi/vueavance/platzimusic/node_modules/prettier/index.js:14131:12)
at /opt/lampp/htdocs/Platzi/vueavance/platzimusic/node_modules/prettier/index.js:42399:15
at Object.format (/opt/lampp/htdocs/Platzi/vueavance/platzimusic/node_modules/prettier/index.js:42418:12)
at Object.module.exports (/opt/lampp/htdocs/Platzi/vueavance/platzimusic/node_modules/vue-loader/lib/template-compiler/index.js:80:23)
@ ./src/App.vue 11:0-311
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

Aun no aumento mi poder de desarrollo, vamos por mas.

Las expresiones nos permiten representar valores del vue model. pueden representarse variables, objetos, operaciones aritmeticas y llamada a funciones en los methods.

Una exprecion permite expresar valores de nuestro vue model o component dentro del html entre {{}}

.

interpolaciones {{ expresion js }}