Vue 2.0 Hello World

by devdev

HTML

<script src="https://unpkg.com/vue"></script>

<div id="app">
  <input ref="input" v-model="message">
</div>

JavaScript

new Vue({
  el: '#app',
  data: {
    message: 'Hello.World'
  },

  watch: {
    message() {
      const pos = this.$refs.input.selectionStart -1
      const message = this.message.replace(/\:\)/gi, 'smile');
      if (this.message !== message) {
        this.$nextTick(() => {
          this.$refs.input.selectionEnd = pos
        })
      }
      this.message = message
    }
  }
});