仅仅只是个人理解，可能不够全面。
v-model绑定就是将两个元素以某一种形式绑定在一起，下面就让我们看看怎么绑定吧。
通过以下代码我们可以看出v-show是一个条件而且color就是他的命名，下面的input就是v-model用它来将二者绑定在一起，默认的话在他不满足条件的情况下是隐藏状态，script里面的就是固定的，当满足v-show的条件他就会显示
1. <!DOCTYPE html> 2. <html lang="en"> 3. 4. <head> 5. <meta charset="UTF-8"> 6. <meta http-equiv="X-UA-Compatible" content="IE=edge"> 7. <meta name="viewport" content="width=device-width, initial-scale=1.0"> 8. <title>Document</title> 9. </head> 10. 11. <body> 12. <div id="app"> 13. <button @click="on" v-show="color=='#ff0000'">点击</button> 14. <input type="text" v-model="color" name="" id=""> 15. </div> 16. <script src="https://cdn.jsdelivr.net/npm/vue@3.2.31/dist/vue.global.js"></script> 17. <script> 18. Vue.createApp({ 19. data() { 20. return { 21. color:'#ffff00' 22. } 23. }, 24. methods:{ 25. } 26. }).mount('#app') 27. </script> 28. </body> 29. 30. </html>
经过上面的描述，我们来看看效果
不满住条件的情况下是这样的
满足条件的情况下是这样的
这样一看是不是豁然开朗。
本篇博客结束谢谢大家观看。。。
