06-v-model使用

最新推荐文章于 2024-05-21 09:04:28 发布

无味无感

最新推荐文章于 2024-05-21 09:04:28 发布

阅读量105

点赞数

分类专栏： VueJs

本文链接：https://blog.csdn.net/qq_41863998/article/details/118655542

版权

VueJs 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

1.使用v-model实现双向绑定

使用场景一般在from表单中
因为input标签中的v-model绑定了message,所以会实现实时将输入的内容传递message,message变量发生改变。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  <div id="app">
    <input type="text" v-model="message">
    <h2>{{message}}</h2>
  </div>

  <script src="../js/vue.js"></script>
  <script>
    const app = new Vue ({
      el: '#app',
      data: {
        message:'孩子,你还好吗???'
      }
    })
  </script>
</body>
</html>