初识Vue

一、什么是Vue

简单的说,Vue是一个用来开发Web界面的前端库,就是一个叫vue.js的文件,就好比jQuery库的jquery.js。

但Vue远不止这些,vue周边还发展了很多其他的工具,也都是一堆js文件。

注意:Vue不支持IE8及以下版本,在移动端支持到Android4.2+ 和 IOS7+

 

二、HelloWorld

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- 1. 首先引入vue.js文件库 -->
    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
</head>
<body>
    <!-- 2. 定义一个ID为app的容器,容器里的内容称为Vue模板,Vue将按模板来渲染页面 -->
    <div id="app">
        {{ message }}
    </div>
    <script>
        //3. 创建Vue实例,并传入一个配置对象{}。Vue实例在实际开发中一般只有一个
        var app = new Vue({
            el: '#app',//指定容器,通常为CSS选择器字符串
            data: {//data用于存储数据,数据供el所指定的容器去使用
                message: 'Hello Vue!'//绑定数据
            }
        })
    </script>
</body>
</html>

第一个Vue程序完成,在浏览器打开该文件,就可以看到Hellow Vue。

 

posted @ 2022-11-13 21:15  weslie  阅读(39)  评论(0)    收藏  举报