码迷,mamicode.com
首页 > 其他好文 > 详细

认识vue(摘录自官网)

时间:2020-03-25 01:02:30      阅读:50      评论:0      收藏:0      [点我收藏+]

标签:文件   浏览器   新标签   引入   整合   类库   sage   语法   htm   

1.官网

https://cn.vuejs.org/

 

2.Vue.js 是什么

Vue (读音 /vju?/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。

 

3.兼容性

兼容性Vue 不支持 IE8 及以下版本,因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性。但它支持所有兼容 ECMAScript 5 的浏览器。

 

4.基础起步

了解关于 HTML、CSS 和 JavaScript 的中级知识。

你可以在浏览器新标签页中打开它,跟着例子学习一些基础用法。或者你也可以创建一个 .html 文件,然后通过如下方式引入 Vue:

<!-- 开发环境版本,包含了有帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<!-- 生产环境版本,优化了尺寸和速度 -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>

 

5.运行第一个hellovue.html

通过外部引入的方式快速学习vue语法。

Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>hellovue</title>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
        <!-- 1.创建视图  view -->
        <div id="app">
            {{ message }}
        </div>
    </body>
    <script type="text/javascript" charset="utf-8">
        // 2.创建视图模型  vm层  等同于vue实例,
        var app = new Vue({ //Vue(首字母必须大写)
            el: #app, // 3.关联v 视图
            data: {
                message: Hello Vue! // 4.创建m 模型 (数据)
            }
        })
    </script>
</html>

我们已经成功创建了第一个 Vue 应用!

 

6.实例的生命周期(请移步到官网)

刚开始学,理解起来费头发,脑子不够用啦。。。

https://cn.vuejs.org/v2/guide/instance.html

 

认识vue(摘录自官网)

标签:文件   浏览器   新标签   引入   整合   类库   sage   语法   htm   

原文地址:https://www.cnblogs.com/antao/p/12563312.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!