Vue-vue基础快速入门

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>

在这里插入图片描述

Vue-vue基础快速入门

猜你喜欢