Vue的入门程序

最新推荐文章于 2024-05-14 19:42:21 发布

#Hideonbush

最新推荐文章于 2024-05-14 19:42:21 发布

阅读量204

点赞数

分类专栏： vue笔记

本文链接：https://blog.csdn.net/weixin_41359273/article/details/109331812

版权

vue笔记专栏收录该内容

16 篇文章 0 订阅

订阅专栏

1.Vue是什么？Vue是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。
2.要想使用它，那就得引用它，使用方式有三种，一种是cdn引入，还有一种直接去官网直接下载，最后一种是通过npm下载，这里暂且用第二种方式。
3.进入到vuejs官网
4.到这个地方，选择开发版本，右击，从链接另存文件为，保存文件到本地
在这里插入图片描述 5.打开webstorm，新建一个项目，将刚才下载的vue.js文件拷贝到项目里面并且新建一个html文件

6.在html里，通过script标签引入vue.js文件,并且写出例子

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="content">
    <h2>{{name}}</h2>
</div>
<script src="./vue.js"></script>
<script>
    const content = new Vue({
        //指定要挂载的元素
        el: '#content',
        data: {
            name: 'Hello VueJs'
        }
    })
</script>
</body>
</html>

7.运行效果
在这里插入图片描述
8.并且，其还是响应式的，我们在控制台修改name时，页面的数据也会跟着改变

#Hideonbush

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Vue的入门程序

1.Vue是什么？Vue是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。2.要想使用它，那就得引用它，使用方式有三种，一种是cdn引入，还有一种直接去官网直接下载，最后一种是通过npm下载，这里暂且用第二种方式。3.进入到vuejs官网4.到这个地方，选择开发版本，右击，从链接另
复制链接

扫一扫

专栏目录