vue 同步輸入顯示

by ysuper

HTML

<script src="https://unpkg.com/vue@next"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
<div id="app">
  <input v-model="message" placeholder="edit me">
  <p>Message is: {{ message }}</p>
</div>

CSS

body {
  padding: 1rem;
}

JavaScript

const vm = Vue.createApp({
  data () {
   return {
      message: 'Hello'
    } 
  }
});

vm.mount('#app');