Vue-vue基础快速入门-优快云博客

本文介绍Vue.js，一个构建用户界面的渐进式框架。Vue聚焦于视图层，提供简单API实现数据绑定和组件化开发。文章包含Vue的基础安装及首个项目实例。

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

1.认识vue
Vue.js（读音 /vjuː/, 类似于 view）是一套构建用户界面的渐进式框架。

Vue 只关注视图层，采用自底向上增量开发的设计。

Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

Vue 学习起来非常简单，本教程基于 Vue 2.1.8 版本测试。
2.下载vue（也可以直接下载vue.js文件调用，有网条件下可以采用以下调用方法）
官方网站：https://cn.vuejs.org/
开发版本（推荐）：

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

生产版本：

<script src="https://cdn.jsdelivr.net/npm/vue"></script>

在这里插入图片描述
3.第一个vue项目开发

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue的第一个入门案例</title>
</head>
<body>
<div id="app">
{{msg}}{{username}}
</div>
<!--<script src="js/vue.js"></script>-->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    const app=new Vue({
        el:"#app",//element,用来给vue定义一个作用范围
        data:{    //用来给vue定义一些相关数据
            msg:"欢迎光临！！！",
            username:"wenxin"
        },
    });
</script>


</body>
</html>