【Vue】双向数据绑定

Trouble=Maker

于 2022-02-11 00:16:50 发布

阅读量79

点赞数

CC 4.0 BY-SA版权

文章标签： vue.js elementui javascript

本文链接：https://blog.csdn.net/weixin_52226593/article/details/122871895

这是一个使用 Vue.js 的基本示例，展示了如何通过 v-model 指令实现实时数据绑定。在网页中，用户在输入框输入的内容会即时反映在页面上，体现了 Vue.js 响应式数据绑定的核心特性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

</head>
<body>

<div id="app">
    <!--通过输入框输入的数据，实时展现在页面-->
    <input type="text" v-model="username" class="id">
    {{username}}
</div>

<script>
    new Vue({
        el: "#app",
        data: {
            username: ""
        }
    })
</script>

</body>
</html>