vue如何优雅的使用keep-alive实现页面缓存

最近有一个页面,头疼的紧啊!一个页面,八种类型,一部分公用类型,剩下的信息按照类型的不同来随时切换,中间还会跳到别的页面选择相应的信息再回来,但是之前选择的信息不能消失,因为中间的状态太多,所以考虑用了vuex,但也试着用了一下keepalive,实际上真的很不错啊

继续阅读“vue如何优雅的使用keep-alive实现页面缓存”

typescript结合react+electron桌面应用程序的实践(二)—路由篇

或许我们已经学会了最基本的配置,如何配置react路由、如何启动electron+react项目、typescript的描述文件、如果能掌握一点typescript的基本知识,再配置一点webpack【之前的博客】的基本loader,webpack的开发环境、生产环境配置,最最最基本的骨架已经可以修改和配置了,只需要在需要的时候查缺补漏就可以,剩下的事情或许就是写页面了。

react-router 4版本还是有很多注意的地方,代码就像情人,一段时间不见,就没感觉了,所以还是再熟悉一遍了。

本篇文章主要是转发,然后在原来的基础上进行实践和补充,原文链接

继续阅读“typescript结合react+electron桌面应用程序的实践(二)—路由篇”

typescript结合react+electron桌面应用程序的实践(二)—react-router配置篇

或许,分节奏、分篇幅来写是一个不错的选择,毕竟,谁也不喜欢裹脚布一样的阅读体验。

我们在配置好最基本的项目启动之后,我们可以看到最最最原始的一个原生应用窗口,里面只有脚手架自带的一个页面,一个完整的前端项目,我们希望是路由、组件、功能模块、公用组件封装等等一系列来组成,我们在这一篇来记录react-router的配置方法,或许结合typescript你会发现不一样的写法。

继续阅读“typescript结合react+electron桌面应用程序的实践(二)—react-router配置篇”

typescript结合react+electron桌面应用程序的实践

本篇博客会记录从零开始构建react+electron+typescript的应用实例,源码地址

react是前端的热门框架,我们会练习使用组件,以及使用路由来分模块页面,封装简单的公用组件。内部的组件都是tsx后缀,加入了typescript的使用

electron是让我们实现桌面应用的框架,你可以理解为一个桌面应用的壳,在这个壳里面用HTML,CSS和JavaScript来构建跨平台桌面应用程序,Electron通过将ChromiumNode.js合并到同一个运行时环境中,并将其打包为Mac,Windows和Linux系统下的应用来实现这一目的

typescript是我们javascript的超集,这也是第一次结合使用,希望可以顺利了

继续阅读“typescript结合react+electron桌面应用程序的实践”

webpack配置生产环境

开发环境(development)生产环境(production)的构建目标差异很大。在开发环境中,我们需要具有强大的、具有实时重新加载(live reloading)或热模块替换(hot module replacement)能力的 source map 和 localhost server。而在生产环境中,我们的目标则转向于关注更小的 bundle,更轻量的 source map,以及更优化的资源,以改善加载时间。由于要遵循逻辑分离,我们通常建议为每个环境编写彼此独立的 webpack 配置

继续阅读“webpack配置生产环境”

深入vue响应式原理实例解析

我们在使用vue开发前端的过程中,最最最直接的感受,那就是绑定。不管是多页面中的实例,还是.vue组件中的data,都能实时的和页面绑定,然后再配合一系列【v-if、v-show、v-bind】等等指令,来让我们的数据控制UI视图层,从而摆脱了以往通过修改DOM结构来修改页面的方式。那我们既然知道了响应式,那有哪一些是需要我们特别注意的呢?

继续阅读“深入vue响应式原理实例解析”

vue文件中怎么动态引入外链js呢?

我们在开发vue项目的时候,是不是都是script,然后里面是我们的data数据,然后是生命周期,紧接着就是methods,这是最常见的模式。
那么,我问你,如果我的有些移动端的.vue文件是在潜入到钉钉微应用【需要钉钉SDK】,有一些是小程序内嵌H5【需要WX JSSDK】,或者是我们自己公司的app,或者只有一个vue文件需要外部的js,这种情况经常遇到,那我们怎么办呢?

继续阅读“vue文件中怎么动态引入外链js呢?”

webapck入门学习【一】

我们在以往的项目中可能使用grunt或者是gulp来对我们的前端项目来做一个资源管理,比如上线发布之前,先执行一下gulp脚本来压缩一下图片或者混淆一下js和css,来让上线发布的文件变得尽量小一些,这样在请求的时候也会更快一些。或许你觉得够了,但是对于我这种不会gulp和grunt的人,还懒的学的来说。。。好像不够啊!而且这俩个在渐渐的落伍,那我不选webpack的话,好像会很傻的样子

继续阅读“webapck入门学习【一】”