关于Vue的一篇学习笔记

Vue学习笔记

自己在学习Vue的时候很迷茫,学长告诉说vue的全家桶要学习,生命周期原理要明白,各种ui框架要会用。。。虽然听的认真但真正开始学还是感到无从下手,跟着官方文档和一些视频苦功了几个月终于算是明白了一些,在这里记录一下自己的成长。
最开始是跟着官方文档从头到尾把每个代码都敲了一遍,但是效率并不高,还有很多地方不明白,后来又找了一些视频,跟着视频里的老师随讲随敲代码才把之前没弄懂的地方弄清楚。当初学习是把组件、插槽和动画这些选择放到最后去学习,因为这些当时对自己来说有些难以理解,一个月的时间我了解了vue的语法,也使用Vue写过几个简单的程序,加深了自己的理解。

起步

学习的第一步当然是HelloWorld。 233
起步阶段对于vue的功能还不熟悉,不建议使用脚手架直接上手,可以直接使用cdn或者引入vue.js文件快速建立项目学习。

dev-tools

vue-devtools是一款基于chrome浏览器的插件,用于调试vue应用,这可以极大地提高我们的调试效率,条件允许可以直接在谷歌应用市场搜索,或者在GitHub寻找,下面附上地址:
https://github.com/vuejs/vue-devtools

Vue脚手架

使用脚手架快速开发项目,免去了手动安装引入路由、vuex等内容的步骤,vue-cli替我们建立好了所需的所有文件和配置,比之前的开发方便了很多。
在脚手架里面我们的工作区在src中,assets为静态文件夹,存放你的图片资源等,component是组件,创建好的组件放在该文件夹下,router是vue路由的配置路径,views是路由显示的页面存放路径,store是vuex的仓库管理文件夹。
App.vue是入口vue文件,写在此页面下的样式和动画对所有页面都有效,main.js是入口js文件,他的作用是实例化vue,存储全局变量,放置项目中经常会用到的插件和CSS样式。

Vue-router

vue路由,路由的作用就是配置不同的路径下显示不同的页面并可实现跳转,在router下的index文件夹下配置他的文件,path是路径,name是该条路由的名字,component后引入定义的路由页面,路径在views文件夹下

Vuex

他是vue的状态管理仓库,小的项目没有必要使用,当数据多到管理起来困难时才有使用它的必要

axios

作者推荐,使用起来也很顺手,需要时根据官方文档引用即可。
axios用于调用后端提供的数据接口,使用方法是在要使用的文件中引入axios
import axios from ‘axios’

element-ui

UI框架有很多,无需纠结一定要用哪一个,公司或者项目需求要求哪一个就用哪个就好,mint、vant也是不错的选择,使用时先在项目中引入,然后去官方文档上面把自己需要的内容拉到项目就可以。

less

css的预处理语言,less、Sass、Stylus,选择一门学习即可,它们是css语言的扩展,可以像js一样使用函数、变量和对象,简化了css的写法。

猜你喜欢

转载自blog.csdn.net/qq_43511063/article/details/107177320