随笔分类 - VUE
VUE框架知识点
摘要:都知道vue是JavaScript驱动。vue最终生成的是dom片段,是一种对其挂载数据设置监听的dom片段。 实际上,早期开发就有这种简单形式。 一,最早的使用document.createElement的dom片段 <div id="app"></div> <script> const appD
阅读全文
摘要:vue官网一共介绍了以下几种过渡: 1,单元素消失和显示之间切换的过渡 1)单个节点 2)同一时间渲染多个节点中的一个 3)利用css transition实现过渡,结合class 切换 4)利用css animation实现动画,结合class 切换 5)自定义过渡的类名可以使用第三方的库实现过渡
阅读全文
摘要:都知道vue-cli用来生成vue的项目模板 在之前公司我们有一个基于vue-cli创建的项目模板,这个模板积累了我们的常用配置和发布在私服npm的ui组件,这个时候要是有一个脚手架,通过命令行工具下载项目模板这样是不是更高大上一些。 这样的背景之下参考了其他脚手架方案,开发了zhen-cli。后来
阅读全文
摘要:transition和animation的对比 transition和animation可以实现一些同样的效果。比如相关尺寸和透明度的变化。 transition和animation都可以用逗号分隔,针对1个以上的属性单独进行设定。 1 .div.opacity { 2 transition: wi
阅读全文
摘要:vue本身只解决了视图渲染的问题,其他问题都是依靠插件来解决的,vuex解决的是数据仓库的问题,vue-router解决的是路由问题。 从最新版的2.x版本分析,版本为2.6.12 Vue本身是一个构造函数,既然是构造构造函数遵从new 操作符的规则。继承原型链,执行构造函数逻辑。 因为这里不是要自
阅读全文
摘要:在分析源码之前,要明确Vue到底做了什么事。从开发角度来说,Vue创建了一种新的开发模式;从浏览器渲染角度来说,Vue创建了一种新的渲染方式。前者方便了开发者,提升了开发效率;后者提升了渲染性能。 传统开发模式:js更改dom,往往无法做到精准更新节点。这里做个假设,我们可以通过缓存dom节点的方式
阅读全文
摘要:框架或者库最早从jquery开始,我把jquery称之为传统的库。而vue、react、ng为现代化的库。 jquery是2006年发布1.0版本,2013 年 5 月react开源,vue是2014年对外发版。 jquery在使用过程中多半充当的是库的作用,相对现在前端框架有以下几个共同点: 1,
阅读全文
摘要:差劲的程序员操心代码,优秀的程序员操心数据结构和它们之间的关系 ————Linus Torvalds,Linux创始人 Flux是由facebook推出的,用来解决MVC架构带来的数据管理问题。 Flux是一种“单项数据流”的管理方式。 在以前,采用MVC架构,MVC无法禁绝View和Model之间
阅读全文
摘要:Vue的高阶组件在官方文档中并未提及,这个是一个舶来品,是React生态才有的一个概念。 但不妨碍我们使用它。 实际上Vue组件就是一个对象。根据高阶函数的概念 在数学和计算机科学中,高阶函数是至少满足下列一个条件的函数: 接受一个或多个函数作为输入。 输出一个函数 高阶组件也就是返回一个组件(对
阅读全文
摘要:本文系常见问题总结文章之一,具体归属于常见设计模式。 打算出常见系列,常见设计模式、常见算法、常见数据结构、常见业务场景。 什么场景下适合命令模式? 有时候需要向某些对象发送命令请求,但是并不知道请求的接受者是谁,也不知道被请求的操作是什么。此时希望用一种松耦合的方式来设计程序,使得请求的发送者和接
阅读全文
摘要:为什么会有vuex? 解决的是单项数据流失效的问题 单项数据流的简介性在多个视图依赖于 同一状态失效的问题 单项数据流来自不同视图的行为需要变更为同一状态的行为 通过定义和隔离状态管理中的各种概念并通过强制规则维持视图和状态间的独立性,我们的代码将会变得更结构化且易维护。 为什么会发生max-age
阅读全文
摘要:Vue的模板实现方式 一种是基本的template模式一种是render函数结合jsx一种是render结合createElement render提升了Vue的编程能力 从单线程异步角度来说,开发是对时间的管理开发也是代码的管理,是对逻辑的管理,设计模式发生的范畴就是逻辑领域 最近看到一句话 如果
阅读全文
摘要:因为大部分情况下都是使用hash模式,因此很少关心History的使用。 最近再次意识熟悉后端才能全面理解项目,于是开始一些相关性研究。下面是History后端服务代码,使用了express框架。使用了ejs模板引擎解析HTML文件。 const http = require('http'); co
阅读全文
摘要:最近遇到这样一个问题:原本用vue-cli2创建的项目,需要用vue-cli3重构。入口文件声明实例时候,使用的是render模式,而不是模板template。 new Vue({ router, render: h => h(App) }).$mount('#app') 而在我们原有的项目中,一些
阅读全文
摘要:一直以来更多的是进行单页面开发。但在与其他同行的交流中,发现多页面项目也是业务的一种需求,趁着今天有时间,今天搞了一下。 多页面的配置,自然也可以根据路由的mode分为hash和history模式。 先说本人更熟悉的hash模式。 一,多页面要有多个入口 默认使用vue-cli 2初始化的项目,需要
阅读全文
摘要:Web开发技术大纲 学而不思则罔,思而不学则殆。学就是总结是记忆。 第一部分 HTML 一 ,Html5权威指南 第一部分 常用html标签 第二部分 html文件dom、css和js加载关系 第三部分 html渲染机制 第四部分 不常用的html标签 比如pre,比如div的可编辑属性 第二部分
阅读全文
摘要:业务背景:公司需要在内网做一个H5的活动页,然后这个任务分配到我这。 业务场景:内网App下webview,需要兼容各种手机,安卓和Ipad和Ios,高版本和低版本。 整体过程实现并不难,难得是怎么去兼容。这个也是解决了兼容性问题之后总结的。 开发过程虽然遇到一些棘手的问题但都被App那边解决了。之
阅读全文
摘要:新开了一个vue的项目,从vue单页面框架搭建到单点登录接入都是自己负责搞的。然后准备将这套东西迁移到react上。然后有了这篇文章。 1,reactjs分环境打包明显要比vue更为麻烦 vue修改的东西比较简单。但reactjs如果不进行eject,只能在引入一个社区解决方案 然后react-ap
阅读全文
摘要:这里的架构方案是基于vue-cli2生成的项目应用程序产生的,是对项目应用程序或者项目模板的一些方便开发和维护的封装。针对单页面的解决方案。 主要有四个方面: 一,不同环境下的分别打包 主要是测试环境和开发环境,修改package.json文件 同时修改webpack.prod.conf.js文件
阅读全文
摘要:之前有个想法,就是要利用vue写一套ui。然后当时也没有搞清楚到底怎么写。 几经周转吧,通过付费的方式在gitbook上面找到了答案。 找到答案之后再看我们正在开发的项目,看伙伴写的代码,突然发现完全可以按照写ui组件库的方式调整目录结构。于是动手了,于是新的目录结构。最重要的是终于从实际层面开始向
阅读全文


浙公网安备 33010602011771号