Data Binding

S aún no te quedó muy claro la diferencia entre

v-bind

v-model

lo principal a tener en cuenta es que el v-bind es one-way data binding, así cómo el prof lo explicó desde el modelo podemos reflejar al DOM,

El v-model es two-way data binding no sólo podemos podemos reflejar al dom sino que del DOM reflejar en el modelo.

Tal cómo lo hizo el prof con la propiedad name obtuvo lo que se escribía del input, pero esta misma propiedad name la utilizó para renderizar ese mismo contenido que estaba escribiendo en el input al parrafo

To Way Data Binding, una de las cosas que hacen a Vue, esto enlaza la vista con el código, y a medida que cambias el input, el valor enlazado también va cambiando, es una de las cosas que me hacen amar a Vue ❤️

Bind (enlazar). en Vue un enlace es mutuo. Si algo se cambia desde el código se ve reflejado en la vista y si se cambia la vista se verá reflejado en el código.

El poder de la re actividad con vue es totalmente increíble, en especial por el sincronismo que nos provee el Data Binding con muchos componentes de HTML con directivas y expresiones tan simples como estas:

<template lang="pug">
  #app
    input(v-model="name")
    label {{ name }}
    a(:href="name") Link
</template>

consulta, cuando le paso de manera dinamica una imagen a variable “poster” este genera error ([Vue warn]: Error in render: “Error: Cannot find module ‘./’.”) de iagual forma src . Si me funciona bien con la etiqueta img ahi si no tengo ningun problema, espero que me puedan ayudar. Agradezco de antemano.
<video v-bind:poster=“require(@/assets/${arreceta[0].poster})” controls=“controls” width=“100%” height=“100%”>
<source src="@/assets/video2.mp4" type=“video/mp4”/>
</video>

Data Binding, implica que podamos enlazar datos desde nuestra vista a nuestro código y desde nuestro código a nuestra vista. esto nos permite capturar la interaccion del usuario con la UI.

<template lang='pug'>
  #app
    img(src='./assets/logo.png')
    h1 Calculador de edad
    input(v-model="age")
    p La edad es:
    h1 {{ fullName }}
</template>
<script>
export default {
  name: 'app',
  data () {
    return {
      age: ''
    }
  },
  computed: {
    fullName () {
      return 2019 - this.age
    }
  }
}
</script>
<style lang='scss'>
@import './scss/main.scss'
</style>

Hola , alguien me podría ayudar a resolver este error por favor:
estoy usando
input(v-model=“name”)

y me sale el siguiente error

gracias

La directiva v-model permite interactuar el dom con el codigo directamente asignando datos entre si.