VUE快速入门,简单上手
在这之前,让我们先了解什么是vue
Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。
学习VUE前提
需要了解关于 HTML、CSS 和 JavaScript 的中级知识。
如果你并没学过或者刚开始学以上条件,那就先去打下基础嗷,俗话说:基础不牢,地动山摇。
在这里我推荐去:菜鸟教程 或者 w3school
相应聪明的你一定学得飞快!
开发软件和环境
我个人推荐这两款: Hbuilder ,vscode
不过我在用Hbuilder,因为电脑上正好安装了,而没有安装vscode哈哈哈
下载安装完善之后,我们打开vue官网,开始第一vue程序!
vue官网:官网在这里,点我就行
之后点【起步】
然后找到下面两个内容
<!-- 开发环境版本,包含了有帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
或者:
<!-- 生产环境版本,优化了尺寸和速度 -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
在这里我说一下两者的区别嗷
开发环境版本——开发版本的jquery 适合初级选手学习阶段,有提示
生产环境版本——生产版本的jquery 进阶,但是速度更快了,也就是说没有提示
这就是我们要找的包,我们复制第一个,然后粘贴到编辑器里的body标签下即可导包完成,如下图:
接下来,就要开始撸代码了,来实现第一个vue程序!
第一个vue程序——el挂载
第一步:我们在head下新建一个div,id或者class随你取(不过下方调用的时候记得id和class的用法,别告诉