I'm reading the vuejs docs including http://vuejs.org/guide/syntax.html and http://vuejs.org/guide/syntax.html#Binding_Expressions. In simple terms ( for a JS beginner ) can someone explain what is being bound. Also is this connected to the 'v-bind' syntax?
Thank you.
The whole idea of Vue is that you don't have to update the DOM manually (by adding a new div, or any other element). The html automatically updates when you change your JS variables. So for instance, if you have <span>Hello {{ name }}!</span> in your code, then you have a corresponding variable in Vue called name. When you update the variable name, the contents of that <span> automatically update. So that is "bound" to the javascript variable.
Anytime you see a custom Vue attribute like v-bind or v-on, the value that you send it is a variable, not a string. For instance, you could use <button v-bind:disabled="thisIsDisabled">. Then you need to have a variable in Vue called thisIsDisabled, and if it is true the button will be disabled, and if it is false the button will be active. Again, you don't have to update the button to disable or enable it, it's disabled attribute will be bound to your variable.