Vue框架基础语法(一)

最新推荐文章于 2024-03-13 15:38:44 发布

weixin_45846357

最新推荐文章于 2024-03-13 15:38:44 发布

阅读量297

点赞数

本文链接：https://blog.csdn.net/weixin_45846357/article/details/107753764

版权

本文介绍了Vue框架的基本语法，包括使用var app = new Vue({})创建Vue实例，el选项用于指定Vue实例作用的DOM元素，以及如何利用双大括号{{}}进行数据绑定。示例中展示了数据直接在内存中修改并实时反映到视图上，强调了Vue的数据绑定机制能提升开发效率和程序性能。

摘要由CSDN通过智能技术生成

基本语法实例

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <div id="app">
            <p>你的名字是：{
  {name}}</p>
        </div>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script>
        var app=new Vue({
            el:'#app',
            data:{
                name:'丑八怪'
            }
        })
    </script>
    </body>
</html>

说明：
var app=new Vue({})，建了一个vue的对象，对象中需要一些配置：

el：意思是element，用来告诉vue，这个对象和哪个元素绑定，也就是生成的对象会产生一个域，这个域是作用在哪个元素上的，例如作用在id为app的元素，就写成el：’#app’

你的名字是：{ {name}}

vue会解析

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_45846357

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Vue框架基础语法(一)

基本语法实例<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div id="app"> <p>你的名字是：{{name}}</p> </d
复制链接

扫一扫