# 雙向綁定

利用 ==v-model== 做資料的雙向綁定，v-model具有雙向綁定資料的效果

  <div id="app">
      <h1>{{text}}</h1>
      <!-- 利用 v-model const的資料綁定-->
      <input type="text" v-model="text"/>
      <br />
      <br />
      <br />
      <!-- 利用 v-model const的資料綁定-->
      <h1>{{message.name}}</h1>
      <input type="text"  v-model="message.name"/>
    </div>
    <script src="./js/vue.js"></script>
    <script>
      const { ref, reactive } = Vue;
      const App = {
        setup() {

          const text = ref('Hello Vue')
          const message = reactive({name:"Bryan"}) 
          return {
            text,message,
          };
        },
      };
      Vue.createApp(App).mount("#app");