Vue.js 01 概述

最新推荐文章于 2022-07-08 17:12:08 发布

loetca

最新推荐文章于 2022-07-08 17:12:08 发布

阅读量256

点赞数

分类专栏： Vue.js 文章标签： vue-js 框架 JavaScript MVVM

本文链接：https://blog.csdn.net/adsl624153/article/details/80153205

版权

Vue.js 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1、简介

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

2、引入Vue.js

【通过script标签引入】
有2种版本，开发版(vue.js)和压缩版(vue.min.js)
如果使用开发环境版本，可以在浏览器控制台中查看帮助用的命令行警告

注意：要在head标签中去引用vue.js，如果在body标签中引用，则有可能出现页面抖屏的情况出现。

3、Hello World

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>Vue</title>
        <script src="./js/vue.js" type="text/javascript"></script>
    </head>
    <body>
        <div id="app">
            {{message}}
        </div>
        <script type="text/javascript">
            var vue = new Vue({
                el: '#app',
                data: {
                    message: 'Hello Vue!'
                }
            });
        </script>
    </body>
</html>

解释：

⑴ el【挂载点】指的是Vue实例和哪个DOM节点做绑定（接管页面上的id='app'的元素里面的内容）
⑵ Vue里的数据，放到data里面

4、Vue和传统JavaScript的不同

原生的JS或jQuery是操作DOM元素；而Vue则是操作数据(着重数据的编写)

loetca

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Vue.js 01 概述

Vue.js 01 概述
复制链接

扫一扫

专栏目录