- 博客(98)
- 收藏
- 关注
RSS订阅转载 微信小程序中悬浮窗功能的实现（主要探讨和解决在原生组件上的拖动）
问题场景所谓悬浮窗就是图中微信图标的按钮，采用fixed定位，可拖动和点击。这算是一个比较常见的实现场景了。为什么要用cover-view做悬浮窗？原生组件出来背锅了~最初我做悬浮窗用的不是cover-view，而是view。这是简化的代码结构：index.wxml:<view class="move-view" style=" top:{{top}}px;left...
2019-08-02 12:14:00
1046
转载 ios下，微信小程序scrollview组件中的fixed元素抖得和帕金森病人一样
问题现象这个问题是最近在优化小程序代码时发现的。在ios环境下，微信小程序的scrollview组件包裹着一个position：fixed的view。当在scrollview组件上滑动时，这个view会疯狂抖动。直接上图吧：下面是简化后的代码：<view class="main"> <scroll-view scroll-y="{{true}}" bi...
2019-07-30 08:39:00
543
转载 微信小程序在ios下Echarts图表不能滑动的解决方案
问题现象这个问题的现象说起来很简单。小程序页面中有一篇很长的文章，内部有一个Echarts图表，手指上下滑动观看内容。但是手指滑动区域在Echarts图表上时，页面却不能滑动了。如下图：追踪问题原因因为在小程序上渲染图表用到的是echarts-for-weixin这个组件,而这个组件确实不支持一些Echarts功能。所以最开始我怀疑是这个组件的问题，认为它把我的滑动事件给...
2019-07-09 23:16:00
1466
转载 微信小程序入口场景的问题整理与相关解决方案
前言最近一段时间都在做小程序。虽然是第二次开发小程序，但是上次做小程序已经是一年前的事了，所以最终还是被坑得死去活来。这次是从零开始开发一个小程序，其实除了一些莫名其妙的兼容性问题，大多数坑点都是在微信小程序的各个入口场景处。所以这里整理一下微信小程序的各个入口场景，以及从这些入口场景进入小程序会面临的问题以及解决方案。这里只列出常用的几种场景：[简单场景]启动小程序并进入...
2019-06-26 00:41:00
388
转载 Unity3D中Isometric Tilemap功能实践
前言最近出于兴趣想自己做一个2D的游戏，因为有着C#的基础，所以决定使用Unity3D来做。之前对于Unity3D其实了解不多，不过看了一些Unity3D的视频和官方文档后，暂时做起来也没遇到什么太大的困难。本篇博客要说的是Unity 2018.3新增的一个东西——Isometric TileMap，一般用于做一个2.5D的地图。这个东西官方文档讲的并不详细,并且有些配置完全没...
2019-01-31 21:49:00
369
转载 天坑之路：用js给选中文字添加样式
前言本例基于react，但是实际上就是用原生js做的。兼容性做到了IE9，但是按照这个思路做是可以做到IE8甚至更低的。需求与最初的思路当我拿到这个需求的时候以为很简单，就是可以给页面上的文章做记号，比如添加个下划线，或者背景涂色做成荧光笔的样子。因为只需要兼容IE9，所以window.getSelection是支持的。（IE8及以下有其它的获取选中的方法）那么思路就是选中文本...
2018-12-27 17:52:00
91
转载 实现可调整宽高的DIV（左右拖动和上下拖动）
前言本例是在React中实现，不过改一改通过原生js也很好实现，另外兼容性也做到了IE9。（IE8讲道理也是可以的）。首先看一下需要实现的需求：要拖动图中的白色横条调整绿色和蓝色区域的高度，要拖动白色竖条调整左边区域和红色区域的宽度。一两年前曾经遇到过这个需求，当时直接在网上搜了个解决方案贴上去了，不过那个解决方案很挫。这次的项目又遇到这个需求，而且是三个块的拖动。不仅需要左...
2018-12-14 10:36:00
1831
转载 【IE11请求中止】 XMLHttpRequest: 网络错误 0x2ef3的意外出现
BUG现象今天排查BUG遇到一个有趣的BUG，测试的截图显示这个BUG只在IE11下出现。BUG原因这个问题的原因是keep-alive机制引起。当浏览器在向一个网址发起请求时，会建立一个tcp/ip连接，之后发起的请求会复用这个连接。但是这个连接有两个限制，就是连接超时时间和最大连接次数，超过了就会断开，下次再请求这个地址，会重新建立一个新的ttcp/ip连接。在chr...
2018-11-23 19:07:00
798
转载 Redux与它的中间件：redux-thunk，redux-actions，redux-promise，redux-saga
序言这里要讲的就是一个Redux在React中的应用问题，讲一讲Redux，react-redux，redux-thunk，redux-actions，redux-promise，redux-saga这些包的作用和他们解决的问题。因为不想把篇幅拉得太长，所以没有太多源码分析和语法讲解，能怎么简单就怎么简单。Redux先看看百度百科上面Redux的一张图：这是Redux在Git...
2018-08-20 15:44:00
474
转载 webpack打包经验——处理打包文件体积过大的问题
前言最近对一个比较老的公司项目做了一次优化，处理的主要是webpack打包文件体积过大的问题。这里就写一下对于webpack打包优化的一些经验。主要分为以下几个方面：去掉开发环境下的配置ExtractTextPlugin：提取样式到css文件webpack-bundle-analyzer：webpack打包文件体积和依赖关系的可视化CommonsChunkPlugin：提...
2018-07-18 11:08:00
1893
转载 React中嵌套组件与被嵌套组件的通信
前言在React项目的开发中经常会遇到这样一个场景：嵌套组件与被嵌套组件的通信。比如Tab组件啊，或者下拉框组件。场景这里应用一个最简单的Tab组件来呈现这个场景。import React, { Component, PropTypes } from 'react'class Tab extends Component { static propTypes = { ...
2018-07-11 12:03:00
155
转载 【JS复习笔记】03 继承（从ES5到ES6）
前言很久以前学习《Javascript语言精粹》时，写过一个关于js的系列学习笔记。最近又跟别人讲什么原型和继承什么的，发现这些记忆有些模糊了，然后回头看自己这篇文章，觉得几年前的学习笔记真是简陋。所以在这里将这篇继承重新更新一下，并且加上ES6的部分，以便下次又对这些记忆模糊了，能凭借这篇文章快速回忆起来。本篇文章关于ES5的继承方面参考了《Javascript语言精粹》和《J...
2018-07-06 12:17:00
204
转载 纯前端实现图片背景透明化
前言不论是做一些2d的小游戏，或者制作小图标，或者抠图都需要用到这个功能，对图片的背景进行透明化，是我们经常需要用到的一个功能。通常情况下我们都会去下载PS或者美图秀秀这样的软件去制作。但是我真的不想仅仅为了做个透明图像就去下载这些软件，这些软件不仅体积大，要下载个半天，放在电脑上也占空间。最重要的是每次我做这个事情，都需要去临时百度一下制作透明图片的方法。这些软件固...
2018-05-07 23:28:00
1802
转载 在博客园里给图片加水印(canvas + drag)
前言想给自己的一些图片加上水印，于是就捣腾了这么个东西。此功能没有考虑兼容性（太懒了），只在Chrome下测试通过，如果您在什么IE火狐下测试不通过就不要吐槽了。因为应用了download属性，所以IE什么的就不用指望了，如果您是火狐浏览器的话，自己改一下兼容性应该是没问题的。代码什么的开了F12自己拿吧，没有压缩哦。（最后吐槽一下，本来代码是贴进博客里面的，保存为草...
2018-03-30 03:06:00
171
转载 分享一款博客园皮肤及其解决方案
前言要分享的皮肤就是您现在看到的这款，虽然还有不少瑕疵，但是这个皮肤也算是大致完成。本皮肤完全使用css样式，无需申请js权限，对移动端的也做了相应处理，也许您可以从其中得到些借鉴。当然皮肤其实是次要的，主要是分享一下这个解决方案。这里是github上的地址：cnblogs-skin痛点很多人都会使用博客园的css修改自己博客的样式，但是说实话其实在修改的过程中会存在不少麻...
2018-03-27 10:12:00
188
转载 【前端单元测试入门05】react的单元测试之jest
jestjest是facebook推出的一款测试框架，集成了前面所讲的Mocha和chai，jsdom，sinon等功能。安装与配置npm install --save-dev jestnpm install -g jest运行命令jest后会自动运行项目下所有.test.js和.spec.js这种格式的文件。涉及到运用ES或react的，要与babel相结合，加上.babe...
2018-03-22 00:26:00
234
转载 【前端单元测试入门04】Karma
Karma官方介绍A simple tool that allows you to execute JavaScript code in multiple real browsers.即一个允许你在多个真实浏览器中执行js代码的简单工具。使用了karma之后，我们之前为了Enzyme的mount而要求的环境就不需要用jsdom去模拟了，因为karma就是将测试js在真实浏览器...
2018-03-21 10:07:00
142
转载 【前端单元测试入门03】Sinon
前端测试存在的问题在讲Sinon之前，我们得先讲一下在学习了Mocha、chai以及enzyme之后，我们的前端测试还存在的一些问题。比如前台测试需要与后台交互，获取后台数据后再根据相应数据进行测试。又比如一个函数测试依赖另一个函数，我们可以根据测试的目的去模拟另一个函数，讲两者的测试分开，从而达到测试中也能解耦的目的。测试辅助工具SinonSinon是用来辅助我们进行前端测试...
2018-03-20 10:09:00
333
转载 【前端单元测试入门02】react的单元测试之Enzyme
React项目的单元测试React的组件结构和JSX语法，对上一章的内容来讲进行测试显得很勉强。React官方已经提供了一个测试工具库：react-dom/test-utils只是用起来不够方便，于是有了一些第三方的封装库，比如Airbnb公司的Enzyme测试项目的配置本次测试项目是根据上一章的测试项目衍生而来，包含上一章讲到的Mocha和chai，这里只介绍新加的一些模块。...
2018-03-19 10:04:00
242
转载 【前端单元测试入门01】Mocha与chai
Mocha 的简介Mocha是流行的JavaScript测试框架之一，通过它添加和运行测试，从而保证代码质量Mocha 的安装与配置全局安装Mochanpm install -g mocha项目中也安装Mochanpm install --save-dev mocha在package.json中加入下面脚本："scripts": { "test": "mocha"...
2018-03-16 10:15:00
197
转载 【Webpack的使用指南 02】Webpack的常用解决方案
前言说是解决方案实际上更像是webpack的插件索引。写这一篇的目的是为了形成一个索引，将来要用时直接来查找即可。索引目录自动构建HTML，可压缩空格，可给引用的js加版本号或随机数：html-webpack-plugin处理CSS：css-loader与style-loader处理LESS：less-loade与less提取css代码到css文件中： extract-t...
2018-03-15 10:11:00
298
转载 【Webpack的使用指南 01】Webpack入门
使用Webpack有一段时间了，但是感觉之前学的用的都比较零散，所以在这里整理一下Webpack的使用知识，从入门到进阶。创建项目首先创建最简单的一个项目npm init得到以下项目结构：安装Webpack先来个全局的npm i webpack -g再安装项目中的npm i webpack --save-dev此时项目结构为，且注意到package.json中自动生...
2018-03-14 15:28:00
231
转载 【Chrome控制台】获取元素上绑定的事件信息以及监控事件
需求场景在前端开发中，偶尔需要验证下某个元素上到底绑定了哪些事件，以及监控某个元素上的事件触发情况。解决方案普通操作之前面对这种情况，一般采取的措施就是在各个事件里写console.info，然后进行点击等操作触发事件，或者在控制台trigger元素上的事件，或者dispatchEvent。这种方法比较繁琐，而且假如触发这个事件之前需要做大量操作，触发时间后需要重新...
2017-11-15 02:04:00
626
转载 前端工具的安装
前端工具安装简述前言 虽然一直有写前端，而且水平自认上升很快，但是仍然没有玩过模块化开发。 对于前端的这些工具也没有接触过，平时一般都是vs和vs code就搞定了，为了搞一搞模块化开发，准备来玩一下这些前端工具。 所以写写这些前端工具的安装步骤，记录一下以后忘了也能用，如果能帮到别人就更好了。1、NPM和Node.js的安装 安装node.js后，自动就...
2017-05-01 17:56:00
99
转载 【MVC拾遗】MVC的单元测试简单学习总结
关于测试的必要性什么的已经在 重构与测试里扯过了。倒也没必要说，写的代码多了自然就明白这个东西重要性。当时说了坐等被推动去学习单元测试来着，然而等着被人推动的结果就是根本就没人来推你。o(∩_∩)o所以还是自己主动来学，主动来总结了。可测试性设计基础理论知识可测试性设计（Design for Testability, DFT）是一种集成电路技术，它将一些特殊结构在设计阶...
2016-08-14 21:54:00
96
转载 【C#进阶系列】30 学习总结
前面学起来还是很顺的，毕竟很多都接触过。后面学起来只能用“磨”来形容，以至于八章用了2个月。（当然也有相当一些原因是这两个月中发生了一些个人生活上的问题）总的来说收获超大，这种感觉就像大一的时候学习老谭的C语言一样，醍醐灌顶。如果是靠.NET吃饭的人，不读这本书真的是太可惜了。不过这中间也出现了一个很蛋疼的事情，就是我很明显的感觉到最后八章的内容，我在实际应用中很难用到，...
2016-05-31 23:45:00
69
转载 【C#进阶系列】29 混合线程同步构造
上一章讲了基元线程同步构造，而其它的线程同步构造都是基于这些基元线程同步构造的，并且一般都合并了用户模式和内核模式构造，我们称之为混合线程同步构造。在没有线程竞争时，混合线程提供了基于用户模式构造所具备的性能优势，而多个线程竞争一个构造时，混合线程通过基元内核模式的构造来提供不“自旋”的优势。那么接下来就是个简单的混合线程同步构造的例子，可与上一章最后的那些例子相比较： ...
2016-05-31 23:30:00
128
转载 【C#进阶系列】28 基元线程同步构造
多个线程同时访问共享数据时，线程同步能防止数据损坏。之所以要强调同时，是因为线程同步问题实际上就是计时问题。不需要线程同步是最理想的情况，因为线程同步一般很繁琐，涉及到线程同步锁的获取和释放，容易遗漏，而且锁会损耗性能，获取和释放锁都需要时间，最后锁的玩法就在于一次只能让一个线程访问数据，那么就会阻塞线程，阻塞线程就会让额外的线程产生，阻塞越多，线程越多，线程过多的坏处就不谈了。...
2016-05-24 01:03:00
123
转载 【C#进阶系列】27 I/O限制的异步操作
上一章讲到了用线程池，任务，并行类的函数，PLINQ等各种方式进行基于线程池的计算限制异步操作。而本章讲的是如何异步执行I/O限制操作，允许将任务交给硬件设备来处理，期间完全不占用线程和CPU资源。然而线程池仍然扮演着重要的角色，因为各种I/O操作的结果还是要由线程池线程来处理。Windows如何执行同步I/O操作既然说道异步I/O操作，那么首先可以先看看同步操作是如何执...
2016-05-17 00:03:00
111
转载 【C#进阶系列】26 计算限制的异步操作
什么是计算限制的异步操作，当线程在要使用CPU进行计算的时候，那么就叫计算限制。而对应的IO限制就是线程交给IO设备（键鼠，网络，文件等）。第25章线程基础讲了用专用的线程进行计算限制的操作，但是创建专用线程开销大，而且太多的线程也浪费内存资源，那么本章就讨论一种更好的方法，即线程池技术。CLR线程池CLR包含了代码来管理它自己的线程池。线程池是应用程序能使用的线程集合，...
2016-05-10 01:52:00
311
转载 【C#进阶系列】25 线程基础
线程的概念线程的职责是对CPU进行虚拟化。CPU为每个进程都提供了该进程专用的线程（功能相当于cpu）,应用程序如果进入死循环，那么所处的进程会"冻结",但其他进程不会冻结，它们会继续执行！线程的开销因为是虚拟化CPU，所以也会有空间（内存耗用）和时间（执行性能）上的开销。具体的开销：线程内核对象（thread kernel object）操作系统为创...
2016-05-04 01:14:00
87
转载 【C#进阶系列】24 运行时序列化
序列化是将对象或者对象图（一堆有包含关系的对象）转换成字节流的过程。而反序列化就是将字节流转为对象或对象图。主要用于保存、传递数据，使得数据更易于加密和压缩。.NET内建了出色的序列化和反序列化支持。上一个简单的小例子：using System.Runtime.Serialization.Formatters.Binary;namespace MyTest...
2016-04-27 00:13:00
146
转载 【C#进阶系列】23 程序集加载和反射
程序集加载程序集加载，CLR使用System.Reflection.Assembly.Load静态方法，当然这个方法我们自己也可以显式调用。还有一个Assembly.LoadFrom方法加载指定路径名的程序集，实际上其内部是先通过AssemblyName.GetAssemblyName获取AssemblyName对象，然后调用Assembly.Load方法。此时load方法会...
2016-04-21 22:43:00
135
转载 【C#进阶系列】22 CLR寄宿和AppDomain
关于寄宿和AppDomain微软开发CLR时，将它实现成包含在一个DLL中的COM服务器。任何Windows应用程序都能寄宿（容纳）CLR。（简单来讲，就是CLR在一个DLL中，通过引用这个DLL，可以实现包含CLR）CLR COM服务器初始化会创建一个默认AppDomain，这个AppDomain只有在进程终结时才会被销毁。然而宿主程序还可以要求CLR创建额外的AppD...
2016-04-19 01:03:00
175
转载 【C#进阶系列】21 托管堆和垃圾回收
托管堆基础一般创建一个对象就是通过调用IL指令newobj分配内存，然后初始化内存，也就是实例构造器时做这个事。然后在使用完对象后，摧毁资源的状态以进行清理，然后由垃圾回收器来释放内存。托管堆除了能避免错误使用已经被释放的内存，也会减少内存泄漏，大多数类型都无需资源清理，垃圾回收器会自动释放资源。当然也有需要立即清理的，比如一些包含了本机资源的类型（如文件、套接字和数据库...
2016-04-14 23:53:00
109
转载 【C#进阶系列】20 异常和状态管理
异常就是指成员没有完成它的名称所宣示的行动。 public class Girl { public string Name { get; set; } } public class Troy{ Girl girl; public void Love() { Console.WriteLi...
2016-04-05 23:56:00
133
转载 【C#进阶系列】19 可空值类型
可空值类型，正如字面意义上的，是可以为NULL的值类型。这个东西存在的意义可以解决比如数据库的的Int可以为NUll的情况，使得处理数据库数据更简单。实际上可空值类型就是Nullable<T>这个泛型值类型，而C#有一种更简单的语法糖是int？这种用法：Nullable<Int32> 数据库类型 = null;float? 可以为空的浮点类型 ...
2016-03-31 00:52:00
101
转载 【C#进阶系列】18 特性Attribute
这个东西有的叫定制特性，然而我喜欢直接叫特性，但是这样的话一些人不知道我说的是什么，如果我说是Attribute的话那么知道的或者用过的就都懂了。还记得讲到枚举和位标志那一章，关于位标志，有一个[Flags]的用法。 [ComVisible(true)] [Flags] public enum FileAttributes { ...
2016-03-30 02:31:00
122
转载 【C#进阶系列】17 委托
委托主要是为了实 现回调函数机制，可以理解为函数指针（唯一不同的在于多了委托链这个概念）。然而用的时候可以这么理解，但是委托的内部机制是比较复杂的。一个委托的故事delegate void razor(String userName);一个简单的委托被定义了。实际上在编译后这段代码就和下面的代码很像了： class Razor : System.Mu...
2016-03-28 01:03:00
72
转载 【C#进阶系列】16 数组
首先提一下，个人在项目中已经很少用到数组了，更多的时候使用List<>。数组大小固定，如果只是用来存放数据，专门用来读取，更改当然方便。但是更多的时候我们需要进行增删改，这个时候用List<>反而更好。所有数组类型都从System.Array抽象类隐式派生，后者又派生自System.Object。一个数组的诞生String[] arr=Stri...
2016-03-24 23:30:00
96
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人