v-model语法糖

admin

语法糖的主要目的是让代码更易于书写和理解，而不改变代码的实际功能。它可以帮助开发者更快速地编写代码，同时提高代码的可读性。

1. <script setup>
   
2. import { ref } from 'vue'
   
3. 
   
4. const text = ref('')
   
5. 
   
6. function onInput(e) {
   
7.   text.value = e.target.value
   
8. }
   
9. </script>
   
10. 
    
11. <template>
    
12.   <input :value="text" @input="onInput" placeholder="Type here">
    
13.   <p>{{ text }}</p>
    
14. </template>

复制代码

等同于

1. <script setup>
   
2. import { ref } from 'vue'
   
3. 
   
4. const text = ref('')
   
5. 
   
6. 
   
7. </script>
   
8. 
   
9. <template>
   
10.   <input v-model="text" placeholder="Type here">
    
11.   <p>{{ text }}</p>
    
12. </template>

复制代码