Vue.js的个人学习笔记 Vue基础入门
为什么要使用Vue
Vue是一套用于构建用户界面的渐进式框架,相对于其他主流框架Angular,React, 它的优势在于上手容易,代码简洁
Vue的特性
1.轻量级
Angular的使用相对复杂,Vue相对而言更加简单,直接。Vue更加友好
2.数据绑定
Vue是一个MVVM框架,MVVM框架也是Vue的精髓之处,数据可以双向绑定,即**数据驱动视图,视图也可以驱动数据.**在处理表单数据上,Vue的优势更加明显
3.指令
Vue的指令以“v-”开头,指令会给绑定的元素添加一些特殊的行为,会经常使用
4,插件
插件用于对Vue框架功能进行扩展,也是Vue的一个特性,简单的配置过后就可全局使用
安装与开发环境配置
1.Vue作为一个用于构建用户界面的框架,其本质就是一个js文件,下载后与普通js文件导入并无区别
官网地址:https://vuejs.org/下载即可
2.开发软件使用VS code即可
3.git-bash命令行工具官网地址:https://gitforwindows.org/下载即可
根据提示安装,默认即可
4.Node.js环境https://nodejs.org/zh-cn/选择LTS版本长期支持版本即可
5.浏览器使用Chrome谷歌浏览器和安装vue-devtools扩展
vue-devtools的安装较为复杂,可以百度查看教程(简称作者太懒)
做完这些后,你就可以编写你的第一个Vue的实例了
还是我们的第一个编程
第一个实例 Hello World(永恒不变)
<div id="app">
{{msg}}
</div>
<script>
new Vue({
el: '#app',
data: {
msg:'Hello World'
}
})
</script>
关于webpack打包工具
webpack是一个模块化打包工具,在webpack中,一切都是模块,它可以把前端项目中的js,css,图片等文件打包在一起,实现自动化构建
在命令行中执行如下命令即可安装
npm install webpack@4.27.x -g
4.27x为版本号, -g表示全局安装,安装完成后可以使用-v来查看webpack版本
webpack -v
如需卸载
npm uninstall webpack -g
以上行为需要安装Node
会持续更新
算是记录我自己的学习过程
感觉有用的话点个赞赞加关注吧