vue学习之路之需要了解的知识汇总
一、vue是什么?
相关网页: https://vuejs.bootcss.com/v2/guide/ 及菜鸟教程 https://www.runoob.com/vue2/vue-tutorial.html
vue.js是一套构建用户界面的渐进式框架;它只关注图层,采用自底向上增量开发的设计;它的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件。vue完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用。其实抛开官方的一些不知所云的说法,
简单来说,在传统web开发中,我们搭建项目都以html结构为基础,然后通过jquery或者js来添加各种特效功能,需要去选中每一个元素进行命令,这些内容在简单的项目中或者不变的项目中还能应付得来,一旦项目改动或者项目工程较大,代码的修改将是复杂繁琐的,而这时候用了vue,这些问题都不复存在。在比如一些单网页制作成的应用程序,一般涉及到数据交互的内容都很多,而应用了vue之后将大大缩减工作量。
vue在web开发,网站制作中有哪些显著优势?
1.数据绑定:vue会根据对应的元素,进行设置元素数据,通过输入框,以及get获取数据等多种方式进行数据的实时绑定,进行网页及应用的数据渲染 。
2.组件式开发:通过vue的模块封装,它可以将一个web开发中设计的各种模块进行拆分,变成单独的组件,然后通过数据绑定,调用对应模版组件,同时传入参数,即可完成对整个项目的开发。
二、根据本尊推荐的顺序 https://zhuanlan.zhihu.com/p/23134551 进行以下各其他知识的学习
三、路由vue-router<我把它理解为一个a标签,只是其不大一样>
这里的路由并不是指我们平时所说的硬件路由器,这里的路由就是SPA(单页应用)的路径管理器。再通俗的说,vue-router就是WebApp的链接路径管理系统。
vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用。vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来。传统的页面应用,是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中,则是路径之间的切换,也就是组件的切换。路由模块的本质 就是建立起url和页面之间的映射关系。
至于我们为啥不能用a标签,这是因为用Vue做的都是单页应用(当你的项目准备打包时,运行npm run build时,就会生成dist文件夹,这里面只有静态资源和一个index.html页面),所以你写的<a></a>标签是不起作用的,你必须使用vue-router来进行管理。
至于其他关于这方面的只是可以查看 https://router.vuejs.org/zh/ 及 https://www.jianshu.com/p/4c5c99abb864
四、vuex:
它是一个专门为vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension ,提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。
具体可以查看 https://vuex.vuejs.org/zh/ 及 https://baijiahao.baidu.com/s?id=1618794879569468435&wfr=spider&for=pc
五、前端工程化:<个人理解为分工合作,提高效率还方便以后管理修改>
具体可以查看 https://www.cnblogs.com/onebox/p/9570518.html https://www.cnblogs.com/fsyz/p/8274727.html 以及ttps://blog.csdn.net/yxf15732625262/article/details/61668980
六、Node.js <感觉是把一些需要后端实现的挪到了前端>
简单的说 Node.js 就是运行在服务端的 JavaScript。
Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。
Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度非常快,性能非常好。
具体可以查看 https://www.nodeapp.cn/documentation.html 及 https://www.runoob.com/nodejs/nodejs-tutorial.html
七、npm:
它是世界上最大的软件注册表,每星期大约有 30 亿次的下载量,包含超过 600000 个 包(package) (即,代码模块)。来自各大洲的开源软件开发者使用 npm 互相分享和借鉴。包的结构使您能够轻松跟踪依赖项和版本。
npm 由三个独立的部分组成:
- 网站
- 注册表(registry)
- 命令行工具 (CLI)
网站 是开发者查找包(package)、设置参数以及管理 npm 使用体验的主要途径。
注册表 是一个巨大的数据库,保存了每个包(package)的信息。
CLI 通过命令行或终端运行。开发者通过 CLI 与 npm 打交道。
具体可以查看 https://www.npmjs.cn/getting-started/what-is-npm/
八、Webpack:
webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle。
具体可以查看 https://www.webpackjs.com/concepts/ 特别是 https://www.webpackjs.com/api/loaders/
九、vue-cli:
CLI (@vue/cli) 是一个全局安装的 npm 包,提供了终端里的 vue 命令。它可以通过 vue create 快速创建一个新项目的脚手架,或者直接通过 vue serve 构建新想法的原型。你也可以通过 vue ui 通过一套图形化界面管理你的所有项目。
具体查看 https://cli.vuejs.org/zh/guide/
十、require.js:
require.js是一个js脚本加载器,它遵循AMD(Asynchronous Module Definition)规范,实现js脚本的异步加载,不阻塞页面的渲染和其后的脚本的执行,并提供了在加载完成之后的执行相应回调函数的功能
具体查看 https://www.cnblogs.com/ngy0217/p/8780966.html
其他:element
一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库! https://element.eleme.cn/#/zh-CN
vue学习之路之需要了解的知识汇总的更多相关文章
- vue学习之路 - 4.基本操作(下)
vue学习之路 - 4.基本操作(下) 简述:本章节主要介绍 vue 的一些其他常用指令. Vue 指令 这里将 vue 的指令分为系统内部指令(vue 自带指令)和用户自定义指令两种. 系统内部指令 ...
- Vue学习之路之登录注册实例代码
Vue学习之路之登录注册实例代码:https://www.jb51.net/article/118003.htm vue项目中路由验证和相应拦截的使用:https://blog.csdn.net/wa ...
- Vue学习之路---No.4(分享心得,欢迎批评指正)
这里说声抱歉,周末因为有其他事,没有更新博客,那么我们今天继续上周5的说. 老规矩,先回顾一下上一次的重点: 1.利用V-if和v-else来提到show()和hide(),同时要记住,v-else一 ...
- Vue学习之路第一篇(学习准备)
1.开发工具的选择 这个和个人的开发习惯有关,并不做强求,厉害的话用记事本也可以.但是我还是建议用人气比较高的编辑工具,毕竟功能比较全面,开发起来效率比较高. 我之前写前端一直用的是sublimete ...
- 后端开发者的Vue学习之路(一)
目录 前言: iview组件库示例 element组件库示例 Vue的介绍 兼容性: 学习Vue需要的前置知识: MVVM模型 补充: 安装/导入 导入Vue 安装 两种方式的区别: HelloWor ...
- Vue学习之路---No.2(分享心得,欢迎批评指正)
昨天我们大致了解了有关Vue的基础知识和语法:今天我们继续在大V这条路上前进. 首先,我们回忆一下昨天提到的相关知识点: 1.了解Vue的核心理念------"数据驱动视图" 2. ...
- Vue学习之路---No.6(分享心得,欢迎批评指正)
我们还是先回顾一下上一次的重点: 1.事件绑定,我们可以对分别用方法和js表达式对事件进行处理 2.当方法名带括号的时候,在方法中一定要传参:而不带括号的时候,vm会自动配置默认event 3.各类事 ...
- Vue学习之路---No.7(分享心得,欢迎批评指正)
老规矩,先回顾一下上回的重点: 1.对于input框,若为单选框,如果没有对其设置value,那么其checked的值将在true Or false之间切换:如果设置了value,那么将会切换valu ...
- 后端开发者的Vue学习之路(四)
目录 上节内容回顾: npm 介绍 安装 常用命令: 补充: 基于npm的Hello World 项目结构分析 用法迁移 小提醒 ES6语法 知识补充 单文件组件 使用注意: 路由 开启路由 定义路由 ...
随机推荐
- ACM学习历程—CodeForces 176B Word Cut(字符串匹配 && dp && 递推)
Description Let's consider one interesting word game. In this game you should transform one word int ...
- HTTP协议详解之http请求分析
当今web程序的开发技术真是百家争鸣,ASP.NET, PHP, JSP,Perl, AJAX 等等. 无论Web技术在未来如何发展,理解Web程序之间通信的基本协议相当重要, 因为它让我们理解了We ...
- openstack开发环境搭建
1 目的 让linux下的openstack代码能在windows上面实现同步开发. 2 目标 使用samba实现window与Linux的文件共享. 3 实验环境 ...
- plsql 分页
select * from (select rownum rn,ps.* from (select * from user_t) ps ) where rn>=1 and rn<=10 ...
- Go中函数作为值、类型传递。
在Go中函数也是一种变量,我们可以通过type来定义它,它的类型就是所有拥有相同的参数,相同的返回值的一种类型 type typeName func(input1 inputType1 , input ...
- udp通信的消息处理方案
0.引言 大家都知道当使用udp通信时,最大的一个问题是会出现丢包的情况,那么如何可以既使用udp来传输,又同时能有效防止丢包呢? 本文提供一种简单有效的方法,可以显著避免udp丢包的问题.此外,如果 ...
- SmartSql使用教程(2)——使用动态代理实现CURD
一.引言 接着上一篇的教程,本章我们继续讲SmartSql.今天的主题是动态仓储. 老规矩,先上一个项目结构 从第二章开始.我们将原来的单一项目做了一个分离.方便之后的更新. 在这个结构中.原本上一章 ...
- 基于zookeeper实现分布式配置中心(一)
最近在学习zookeeper,发现zk真的是一个优秀的中间件.在分布式环境下,可以高效解决数据管理问题.在学习的过程中,要深入zk的工作原理,并根据其特性做一些简单的分布式环境下数据管理工具.本文首先 ...
- Fenwick Tree / Binary Indexed Tree
Motivation: Given a 1D array of n elements. [2, 5, -1, 3, 6] range sum query: what's the sum from 2n ...
- 2017 Gartner Hype Cycle for Emerging Technologies: AI, AR/VR, Digital Platforms