vue js 2 way data binding not updating

Question

so i have a quick Vue JS question that seems very strange, i have the following

var home = new Vue({
 el: '#home',
 data:{
    title: 'welcome to the app'
 }
});

Which works fine, and title in my HTML gets updated fine...

now when i do this

home.$data.title = 'this is the new title'

the html

  <div class="app-topbar">{{title | uppercase}}</div>

Does not update, do i have to force an update to the data binding or something?

Thanks Sam

Answer 1

This works fine for me. Just set home.title, like this: http://jsfiddle.net/6x2v9y20/1/

Maybe you're trying to access home.title before the Vue item has been created?