vue新手入门——谈谈理解
毕业到现在大概4个月了,从java开发慢慢转到前端开发(其实是因为公司前端人不够),然后开始接触vue。所以我也只是一只小菜鸟。
首先附上vue的官网:vue官网
然后附上一些常用的vue框架,组件之类的资源库Awesomes资源库。
Vue.js (读音 /vjuː/,类似于 view) 是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,它不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与单文件组件和 Vue 生态系统支持的库结合使用时,Vue 也完全能够为复杂的单页应用程序提供驱动。
首先谈谈我对Vue的理解,vue是一个渐进式框架。对“渐进式框架”我的理解大概就是:
1.你在使用的时候只需要对vue提供的内容做加法。当你只是想实现一个简单的双向绑定的时候,你可以只使用vue关于data(){}这部分的内容。你可以简单的把它当成一个js库,来保证在最大限度上不改动源代码的基础上,使用它的特性。
2.进一步你可以直接用Vue来管理页面,这样你就不用去操作DOM了,把DOM的操作全交给vue底层去实现,把一些公用的部分抽出来做成组件,比如menu,list,input,alert,这样代码的简洁性和可复用性会得到提升,一方面会减少你编写重复的代码,另一方面你的关注点从jq的DOM操作,变成数据驱动DOM变化。你可以很方便的使用v-if,v-show,v-bind:class这些指令绑定变量来控制DOM如何变化,渲染还是不渲染,显示还是不显示,该怎么显示。通过变量的变化来驱动DOM的变化。
3.经过学习和使用,你渐渐发现vue还可以具有路由功能,实现前端页面的路由(vue-router);然后发现在一些复杂应用中有很多组件的状态同时依赖于某一个或多个变量,这时候我们就可以把该变量抽离出来,通过vuex做状态流管理;做到这里jq所能做的基本功能都能实现了,那么vue又如何与后台进行数据交互呢,官方推荐使用axios库。
所以我觉得这个渐进可以从多个维度去看待,从开发上,我们可以很轻松的从传统的html开发转到vue开发,可以一个节点一个节点的去靠近它。从使用上,我们不是一个很大的全家桶,然后一点一点的裁剪他的功能,使其符合我们的预期,而是做加法,把某几个很小的功能加成一个符合我们预期的功能(可能这就是自底向上增量开发?)。最后从vue页面来说,我们实现一个页面其实是多个组件的组合,我们可以通过<route-view>来控制页面哪个部分是应该被路由的,页面的可复用性和方便性会得到很大提升,对于页面而已,一个页面其实是多个组件渐进的结果。
因为我前端基础比较薄弱,就不一开始给各位大刀阔斧的讲什么vue的底层实现(其实我也讲不明白)。首先还是从怎么搭建一个vue页面开始。
1.直接下载并用 <script> 标签引入,Vue 会被注册为一个全局变量。(这样子用起来的时候好像要麻烦一点点)
2.通过vue-cli官方脚手架来快速搭建一个大型单页项目。
以上见解有些偏差和错误之处,还请各位指教。
vue新手入门——谈谈理解的更多相关文章
- vue新手入门之使用vue框架搭建用户登录注册案例,手动搭建webpack+Vue项目(附源码,图文详解,亲测有效)
前言 本篇随笔主要写了手动搭建一个webpack+Vue项目,掌握相关loader的安装与使用,包括css-loader.style-loader.vue-loader.url-loader.sass ...
- Vue新手入门教程
谈谈我对Vue的理解 vue就是前端上的Java,前端上的C#.有个前端的虚拟DOM引擎,设计理念和Java,C#类似.我们只需要告诉DOM应该显示什么,而不用去操作DOM元素. 如何引用? 下面是一 ...
- vue新手入门指导,一篇让你学会vue技术栈,本人初学时候的文档
今天整理文档突然发现了一份md文档,打开一看 瞬间想起当年学习vue的艰难路,没人指导全靠自己蒙,下面就是md文档内容,需要的小伙伴可以打开个在线的md编译器看一看,我相信不管是新人还是老人 入门总 ...
- vue新手入门——vue-cli搭建
首先说明,以下内容vue官网都有文档,如果觉得麻烦啰嗦,请移步至 安装-vue.js . 准备工作: 1.下载并安装node环境,一般情况下安装好node之后,npm也会安装好.具体安装的话,百度大概 ...
- Unity 新手入门 如何理解协程 IEnumerator yield
Unity 新手入门 如何理解协程 IEnumerator 本文包含两个部分,前半部分是通俗解释一下Unity中的协程,后半部分讲讲C#的IEnumerator迭代器 协程是什么,能干什么? 为了能通 ...
- MVVM Light 新手入门(2) :ViewModel / Model 中定义“属性” ,并在View中调用
今天学习MVVM架构中“属性”的添加并调用,特记录如下,学习资料均来自于网络,特别感谢翁智华的利刃 MVVMLight系列. 一个窗口的基本模型如下: View(视图) -> ViewModel ...
- 新手入门指导:Vue 2.0 的建议学习顺序
起步 1. 扎实的 JavaScript / HTML / CSS 基本功.这是前置条件. 2. 通读官方教程 (guide) 的基础篇.不要用任何构建工具,就只用最简单的 <script> ...
- 总结Vue 第四天:vue-cli(Vue2.0 新手入门 — 从环境搭建到发布)
总结Vue 第四天:vue-cli(Vue2.0 新手入门 - 从环境搭建到发布) 一.Vue CLI----(Vue2.0 新手入门 - 从环境搭建到发布): ■ CLI是Command-Lin ...
- 【原创】新手入门一篇就够:从零开发移动端IM
一.前言 IM发展至今,已是非常重要的互联网应用形态之一,尤其移动互联网时代,它正以无与论比的优势降低了沟通成本和沟通代价,对各种应用形态产生了深远影响. 做为IM开发者或即将成为IM开发者的技术人员 ...
随机推荐
- Jmeter脚本调试——关联(正则表达式)
关联,在脚本中,是必应用到的一个设置方法,将脚本中,每次都会动态变化的特殊值进行关联.一个能正确执行的脚本,都需要进行关联(LR.jmeter). Jmeter关联: 在脚本回放过程中,客户端发出请求 ...
- 非对称加密RSA的C#实现
1.对称加密算法 对称加密是最快速.最简单的一种加密方式,加密(encryption)与解密(decryption)用的是同样的密钥(secret key). 对称加密有很多种算法,由于它效率很高,所 ...
- .net通用防SQL注入漏洞程序(Global.asax方式)
原理很简单:使用Global.asax中的Application_BeginRequest(object sender, EventArgs e)事件,实现表单或URL提交数据的获取,然后通过SQLI ...
- js-异步机制与同步机制
Javascript的优势之一是其如何处理异步代码.异步代码会被放入一个事件队列,等到所有其他代码执行后才进行,而不会阻塞线程 1 理解异步代码: 1.1 JavaScript最基础的异步函数是set ...
- window开启remote desktop服务
确定自己的PC支持远程桌面 1 先确定被遥控的电脑的系统必须是Professional或Enterprise以上版本,家庭版不支持远程桌面.以Win8.1(7和8同理)为例,依次打开控制面板→系统 ...
- ZOJ 2002 Copying Books 二分 贪心
传送门:Zoj2002 题目大意:从左到右把一排数字k分,得到最小化最大份,如果有多组解,左边的尽量小. 思路:贪心+二分(参考青蛙过河). 方向:从右向左. 注意:有可能最小化时不够k分.如 ...
- zoj3432 Find the Lost Sock 亦或的运用
只有一个出现奇数次,答案就是它了: #include<cstdio> #include<cstdlib> #include<iostre ...
- Sql Server合并多行询数据到一行:使用自连接、FOR XML PATH('')、STUFF或REPLACE函数
示例表 tb 数据如下 id value ----- 1 aa 1 bb 2 aaa 2 bbb 2 ccc SELECT id, [val] = ( SELECT [value] + ',' FRO ...
- oracle temporary table
oralce 有两种临时表 a.会话级临时表 b.事物级临时表 A.事物级临时表 语法 create global temporary table table_name( col1 type1, ...
- 解题笔记-洛谷-P1010 幂次方
0 题面 题目描述 任何一个正整数都可以用2的幂次方表示.例如 137=2^7+2^3+2^0 同时约定方次用括号来表示,即a^b 可表示为a(b). 由此可知,137可表示为: 2(7)+2(3)+ ...