【Vue】6. v-model指令

最新推荐文章于 2024-08-23 14:24:38 发布

wowpH

最新推荐文章于 2024-08-23 14:24:38 发布

阅读量208

点赞数

分类专栏： Vue 文章标签： vue js html

本文链接：https://blog.csdn.net/pfdvnah/article/details/109140909

版权

Vue 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

文章目录

一、前言
二、示例
- 1、代码
- 2、页面效果
三、总结

一、前言

本文通过简单示例学习v-model指令的使用。

二、示例

1、代码

<!DOCTYPE html>
<html>

<head>
    <title>v-model指令</title>
    <script src="../../js/vue.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>
    <div id="app-6">
        <p>{{message}}</p>
        <input v-model="message">
    </div>
    <script>
        var app6 = new Vue({
            el: '#app-6',
            data: {
                message: '这是v-model指令的示例，请在输入框中修改我的内容。
            }
        });
    </script>
</body>

</html>