2020年05月_ 飞翔的熊blabla_飞翔的熊blabla

12月 11月 10月 09月 08月 07月 06月 05月 04月 03月 02月 01月

转载 7.【nuxt起步】-Nuxt与后端数据交互

接下来就是对接服务端接口，展示真实的数据1.做了个虚拟接口地址：http://test.yms.cn/testjson.asp输出数据：{　　"title": "单间出租",　　"price": "350.0元/月",　　"type": "1室1厅1卫",　　"square": "2",　　"keyWord": [{"word": "床"}, {"word": "可做饭"}, {"word": "独立卫生间"}],　　"danjia": "17",　　"xiaoq

2020-05-29 11:57:20 376

转载 Generator详解

很多人初接触es6的Generator的时候可能会觉得云里雾里绕得慌，本文从多种角度详细解说了其基础语法和使用方式，希望看完的你能从雾中走出来~主要有以下内容：1.相关概念2.消息传递3.Generator在流程控制中的应用4.Generator+Promise实现完美异步5.async和await6.yield委托1.相关概念1）为什么要引入Generator？众所周知，传统的JavaScript异步的实现是通过回调函数来实现的，但是这种方式有两个明显的缺陷：缺乏可信任性。例

2020-05-26 21:38:07 113

转载 H5页面页面在iphoneX手机上底部会有留白解决办法

H5页面页面在iphoneX手机上底部会有留白解决办法在meta viewport标签里加属性：viewport-fit=cover；如下<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no, ...

2020-05-18 15:01:15 959

转载前端路由的两种实现方式

什么是路由？路由是根据不同的 url 地址展示不同的内容或页面早期的路由都是后端直接根据 url 来 reload 页面实现的，即后端控制路由。后来页面越来越复杂，服务器压力越来越大，随着 ajax（异步刷新技术）的出现，页面实现非 reload 就能刷新数据，让前端也可以控制 url 自行管理，前端路由由此而生。单页面应用的实现，就是因为前端路由。前端路由实现1.Pjax（PushState + Ajax）原理：利用ajax请求替代了a标签的默认跳转，然后利用html5中的A

2020-05-11 20:06:41 146

转载什么是重排和重绘

当浏览器下载完页面所需元素（html标记，css层叠样式表，javascript，图片）之后，会生成两个东西：Dom树和渲染树。Dom树Dom树，主要是用来表示页面的Dom结构。渲染树渲染树主要是用来表示页面是如何进行渲染的。Dom树中，除了隐藏节点，其余的节点需要与渲染树中的至少存在一个对应的节点。渲染树中的每一个节点，被称为帧或者是盒子。盒子具有内边距，外边距，边框，位置等属性。一旦渲染树构建完成之后，浏览器就开始进行绘制页面。当Dom的变化影响到了元素的几何属性（宽和高等）——

2020-05-11 20:01:18 246

转载 vue父子组件渲染过程，超详细

这里vue的子组件引入有两中方式：同步和异步，因此父子组件加载的顺序是不一样的，接着往下看，会有收获的。一、同步引入例子： import Page from '@/components/page'二、异步引入例子：const Page = () => import('@/components/page')或者： const Page = resolve => require(['@/components/page'], page)image.png同步引入时生

2020-05-11 19:21:19 825

转载全面改革：解读 Vue 3.0 的变化

9月30日，尤雨溪在medium个人博客上发布了vue3.0的开发思路，国内有翻译的版本，见文章最后的参考链接。3.0带了了很大的变化，他讲了一些改进的思路以及整个开发流程的规划。vue3.0的改进思路vue最主要的特点就是响应式机制、模板、以及对象式的组件声明语法，而3.0对这三部分都做了更改。1. 响应式2.x的响应式是基于Object.defineProperty实现的代理，兼容主流浏览器和ie9以上的ie浏览器，能够监听数据对象的变化，但是监听不到对象属性的增删、数组..

2020-05-11 17:00:23 202

原创 sass查找某个子元素不用的方法global

.zjd-wrapper { padding: 2rem; :global { .FormPage-Management { padding: 0px; } }}

2020-05-07 10:01:08 518

转载干货 | React Hook的实现原理和最佳实践

一、在谈 react hook 之前React的组件化给前端开发带来了前所未有的体验，我们可以像玩乐高玩具一样将组件堆积拼接起来，组成完整的UI界面，在加快开发速度的同时又提高了代码的可维护性。但是随着业务功能复杂度提高，业务代码不得不和生命周期函数糅合到一起。这样很多重复的业务逻辑代码很难被抽离出来，为了快速开发不得不Ctrl+C，如果业务代码逻辑发生变化时，我们又不得不同时修改多个地方...

2020-05-05 17:06:35 275 1

转载阿里文娱实战 | 小而美的 egg-react-ssr 开源实现方案

封面图 | CSDN付费下载自视觉中国出品 | CSDN（ID:CSDNnews）本文基于优酷 PC/H5 业务改造的经验心得，提炼出了一套基础的 egg-react-ssr 服务端渲染应用开发的基础骨架。为了更好的对比 Next.js 以及市面上等其他各种实现方案，我提炼出了比较精华的几点优势。小：实现方式简洁；全：功能齐全，配套结合多种热门模块的 example；...

2020-05-05 13:20:28 134