Vue是个啥？

最新推荐文章于 2022-07-07 22:05:43 发布

猿来炸串

最新推荐文章于 2022-07-07 22:05:43 发布

阅读量744

点赞数

文章标签： Vue

本文链接：https://blog.csdn.net/GeekWN/article/details/100034818

版权

官版Vue技术整理——Vue是个啥？

1.Vue是个啥？

咱们看看官方介绍：

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

如果你想在深入学习 Vue 之前对它有更多了解，我们制作了一个视频，带您了解其核心概念和一个示例工程。

如果你已经是有经验的前端开发者，想知道 Vue 与其它库/框架有哪些区别，请查看对比其它框架。

上述可以不看，个人理解Vue就是个轻量级框架，支持数据双向绑定（这是个非常爽的功能），组件化开发，相对React和Angular来说上手简单，官方文档中文，支持国产。

理论的东西不多解释，直接入手API

2.创建第一个Vue实例

<body>
    <div id="app">
        {{msg}}
    </div>
</body>
<script>
    var vm = new Vue({
        el: '#app',
        data: {
            msg: 'Hello Vue'
        }
    })
</script>

运行结果：

在这里插入图片描述

3.再次尝试

我们来尝试一下数据反转

<body>
    <div id="app">
        {{msg}}
        <button @click="reverseMessage">反转</button>
    </div>
</body>
<script>
    var vm = new Vue({
        el: '#app',
        data: {
            msg: 'Hello Vue'
        },
        methods: {
            reverseMessage: function () {
                this.msg = this.msg.split('').reverse().join('')
            }
        }
    })
</script>

在这里插入图片描述

是不是发现很简单完全不用操作DOM对象。

例子咱就不演示了，咱开始根据API学习Vue

猿来炸串

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Vue是个啥？

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

扫一扫