vue1

In this example below you will see how to do a vue1 with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by DM_Daria, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright DM_Daria ©
  • HTML
  • CSS
  • JavaScript
    <div id="app-5">
  <p>{{ message }}</p>
  <button v-on:click="reverseMsg">Reverse msg</button>
</div>
<div id="root">
  
  <button v-bind:title="title">Hover over me</button>
</div>

/*Downloaded from https://www.codeseek.co/DM_Daria/vue1-brNgap */
    #root {
  margin-top: 50px;
}
.color-red {
  color: #cc0000;
}


/*Downloaded from https://www.codeseek.co/DM_Daria/vue1-brNgap */
    var app5 = new Vue ({
  el: '#app-5',
  data: {
    message: 'Hello Vue.js!'
    
  },
  methods: {
    reverseMsg: function() {
      this.message = this.message.split('').reverse().join('')
    }
  }
});
var app = new Vue ({
  el: '#root',
  data: {
    title:'Now the title is being set throght JS'
  }
});

Comments