- 博客(58)
- 资源 (3)
- 收藏
- 关注
RSS订阅
原创 RN使用mobx状态管理库
RN引入mobx状态管理库mobx介绍Mobx和Redux都是应用于React工程优秀的状态管理库，可以解决我们跨页面跨组件间通信问题。不过理念有所不同，Redux推崇状态树的概念，认为一个应用中只应该存在一个状态库，通过Provider将store挂载到视图顶层，使用的组件通过connect方式用props来访问需要的状态属性。而Mobx则并不强调状态树的概念，而是可以各自模块使用各自的状态库，不过也同样可以通过Provider将状态挂载到顶层视图，在消费组件中通过inject获取到props状态。
2021-12-10 17:25:55
1649
2
原创 手写签名图片处理-Android
背景用户通过笔在纸上手写了个人签名，通过拍照上传的方式将其笔迹设置为签名图片。如果直接使用此图片（包括裁剪后的图片），则在签名的过程中会签名图案中不但有用户的笔迹，还有纸的颜色背景，效果堪忧。解决目标将用户的手写笔迹采集，并且背景色是透明的解决思路1.用户选择已经拍摄的笔迹照片2.用户通过裁剪区域选择手写笔迹（尺寸为300*120）3.程序将裁剪好的手写笔迹区域进行笔迹采集和透明化处理将图片中的黑色像素点1 保留，其他像素点设置为透明 （难点和重点：哪些色值可以被认定为笔迹、用户拍照时候
2020-11-09 15:21:23
1806
8
原创 扫二维码打开小程序
微信小程序在当前的技术环境中占据了大量市场。此次接到客户需求，需求的描述很简洁：通过微信扫码，进入小程序并继续完成业务操作问题分析：1.通过微信扫码进入到小程序2.进入小程序后需要引导用户进行业务操作开发配置首先，如果生成一个微信能识别的二维码（可以使用草料二维码生成器https://cli.im生成二维码）我们可以根据微信的开发文档（可以搜索普通链接二维码到文档页面）h...
2020-04-21 16:49:20
14424
3
原创 归并算法-JavaScript实现
概念归并排序是建立在归并操作上的一种有效，稳定的排序算法，该算法是采用分治法（Divide and Conquer）的一个非常典型的应用。将已有序的子序列合并，得到完全有序的序列；即先使每个子序列有序，再使子序列段间有序。若将两个有序表合并成一个有序表，称为二路归并。示例图原理归并排序的原理代码实现递归算法个人对于递归算法的理解是：把数组均分为左右两个子数组（假设子数组是有序数组，如果length%2 ==0，则右边多一个数据 ），然后进行有序数组合并左右数组重复上一步的操作直到子数
2022-04-18 15:24:11
497
原创 Software Engineering at Google翻译-III-9-Code Review（代码审查）
Software Engineering at Google翻译-III-9-Code Review(代码审查)
2022-03-22 12:05:19
815
原创 Software Engineering at Google翻译-III-8-Style Guides and Rules(风格指南和规则 )
Software Engineering at Google翻译-III--8-Style Guides and Rules(风格指南和规则 )
2022-03-21 10:49:45
632
原创 Software Engineering at Google翻译-III-12-Unit Testing(单元测试 )
Software Engineering at Google翻译 第三篇 第12章 单元测试的翻译
2022-03-18 14:40:35
1797
原创 Software Engineering at Google翻译-III-11-Testing overview（测试概述）
Software Engineering at Google翻译 第三篇 第11章 测试概述（Testing overview）
2022-03-16 18:40:44
1676
原创 RN配置eslint规则
在ReactNative配置git hooks进行eslint检查一文中有详细介绍ReactNative项目怎么添加git hooks，使得在git commit之前对代码进行eslint检查，本文记录一下对应的eslint规则。eslint实用规则规则继承自@react-native-community，在此基础上进行一些自定义的rules配置，具体含义可以在eslint官网查看具体说明是示例module.exports = { root: true, extends: ['@react-n
2021-11-09 15:15:59
1019
原创 ReactNative配置git hooks进行eslint检查
为了让我们commit代码时，可以避免提交一些测试性的例如alert、if判断写死等调试性代码，同时增强项目代码的健壮性和可维护性，特引入git hooks配置使得没有通过eslint的规则校验的暂存区文件无法commit的到本地仓库引入过程引入依赖包 yarn add -D [email protected] @react-native-community/eslint-config lint-staged typescript为什么eslint使用7.32.0，而不使用最新的8.x版本因为e
2021-11-05 14:35:58
760
原创 Android实现手写板功能
自定义Android手写签名组件，并进行手写区域裁剪使用方法： /** * 初始化视图，将手写版添加到布局中 */ private void initView() { mDrawView = new DrawView(this); LinearLayout layout;// layout中挂载的一个布局，用来加载手写板 ViewGroup.LayoutParams layoutParams = new ViewGrou
2021-08-23 20:05:05
1391
转载 github clone代码失败SSL_ERROR_SYSCALL in connection to github.com:443
问题描述在使用git拉取github代码时候，clone失败并出现以下错误fatal: unable to access 'https://github.com/xxx/xxx.git/': LibreSSL SSL_connect: SSL_ERROR_SYSCALL in connection to github.com:443 出现原因之前设置了https的代理解决方法取消https和http代理git config --global --unset http.proxygit co
2021-04-28 11:09:27
3560
原创 解决Chrome浏览器http自动转https的问题
在chrome浏览器中，当对一个域名使用https访问后，之后再使用http协议访问，最后都会被转化成https，这个对我们开发调试带来了很大的不便。记录一下如何解决这个问题打开管理页面打开chrome浏览器，地址栏输入以下协议并回车chrome://net-internals/#hsts浏览器中将会出现以下页面，可以通过以下操作将已经自动转https协议的域名从chrome中移除Domain Security ProlicyDelete remain security prolicies
2021-03-16 15:02:32
11081
7
原创 npm删除组件库
在做npm组件库时，会需要通过npm publish发布到仓库中进行自验，因此在开发到稳定包的过程中，可能会出现多个有问题的版本，此时可以通过删除整个组件库，或者删除某个指定版本的方式来进行组件库的清理工作删除整个组件库cd到组件库的package.json文件的同级目录npm unpublish --force //强制删除删除某个版本npm unpublish <组件名>@<版本号> <note>对某个版本进行作废npm deprecate <
2021-03-15 14:24:11
1727
原创 css伪元素before和after显示问题
记录新入职前端同学的一个问题：css在添加了before和afer后并不显示的问题html的代码段<div class='test'> <span>测试</span></div>不显示的css.test{}.test::before{ width:20px; height:20px; background:#F0F;}问题出现的原因：没有搭配content属性使用只需要在before中添加content即可展示.test{}
2021-02-24 18:23:11
3264
原创 Android adb选择设备安装应用
简要记录在Android开发中安装替换apk的一个小技巧场景1.Android开发2.电脑连接了多个设备（包括开启了的模拟器）此时如果直接使用adb install执行安装，会报错more than one device/emulator需求在电脑连接了多个设备时候，需要指定真机或者模拟器完成apk的安装命令查看设备列表的idadb devices执行结果如下daidais-mac:~ bjcaywq$ adb devicesList of devices attached7X
2021-02-08 20:36:25
3479
原创 react-native-webview和h5通信
直奔主题，不贴官方文档。在支持RN客户端和基于vue开发的前端页面信息交互的期间，记录一下关于WebView和html的交互过程，主要通过一下三点来记录：html向RN通信RN向Html通信在项目中使用官方文档有介绍如何进行交互，官网传送门React Native -> Web: The injectedJavaScript propReact Native -> Web: The injectJavaScript methodWeb -> React Native:
2021-02-07 15:58:54
5512
4
原创 前端项目指定npm源——.npmrc
当我们的前端项目npm仓库有多个源，想在某个单独的项目中使用特定的npm源，则可以通过.npmrc文件来进行配置1.在项目根目录下创建.npmrc文件2.编辑文件，输入registry="目标源地址"registry="https://registry.npmjs.org/"3.通过命令npm config ls查看当前项目下的registry是否发生了变化配置完成后，npm源地址只在此项目中生效，并不会对全局npm的配置影响，可以在别的终端上通过命令npm config ls进行验证...
2021-01-06 14:16:11
9701
原创 React-Native PanResponder详解
最近想封装一个滑动组件给项目其他组件使用，React Native官方文档中就PanResponder的使用有做大致的讲解，同时网上也有各种关于PanResponder的详解教程，但在真实集成的时候发现了以下问题，谨以此文记录。先说结论不能在TouchableOpacity中使用触摸被设置了PanResponder的View，如果内部有TouchableOpacity，只有当onStartShouldSetPanResponderCapture为false时，内部的事件响应才能被执行...
2020-12-18 15:00:29
2098
原创 mobx升级到6后组件不刷新
问题描述项目进行package.json中的依赖包全量更新（可以参照npm更新项目中全部依赖），将mox:5.15.7，mobx-react:6.3.1更新到 mox:6.0.4，mobx-react:7.0.5 应用通过@observable修饰的属性变更后，视图并不刷新问题寻求解决思路github中issue找到了关于autorun无法自动触发的问题，推理视图无法刷新的原因也是一致的（mobx中文网还没有更新mobx6版本的文档，部分调整暂时我们只能通过某些方式去看官网了，你懂的）issue中的
2020-12-14 17:08:33
2183
7
原创 npm更新项目中全部依赖
1.cd到package.json目录中，执行npm outdatedPackageCurrentWantedLatestLocation包名当前版本满足semer版本的最高版本（及在兼容的前提下能更新的最高版本）当前最高的版本红色：可以立即更新黄色：需要进行兼容，慎重更新全部更新在已有项目中，不建议采用全部更新，推荐使用npm update按需更新安装ncu，执行 npm install -g npm-check-updates执行 ncu -u
2020-12-14 15:19:45
1961
1
原创 基于Hoc封装业务FlatList
Hoc是什么？HOC（High Order Component） 是react提出的一种设计模式，接收一个组件作为参数，并返回一个新的组件。业务FlatList封装起因FlatList作为ReactNative开发中最长使用到的组件之一，其官方已经封装很完善了，我们的列表页面只需要简单引入即可，但是，一般app中会有多个页面都是列表展示，并且没有太复杂的操作，而我们则需要复制多个FlatList，包括头部、底部、间隙等组件的配置，更重要的是在处理FlatList的data列表数据时，我们需要下拉刷新
2020-12-09 18:26:50
457
原创 图片转Base64换行的问题
接上一篇 Android识别手写笔迹并透明化处理由于我们的服务端接口是通过base64接收处理后的图片，因此需要将图片处理成Base64字符串(忽略将图片从文件转化为Bitmap的过程)/** * bitmap转为base64 * @param bitmap * @return */ public static String bitmapToBase64(Bitmap bitmap) { String result = null;
2020-12-04 16:00:42
1729
原创 算法题：求100以内的所有素数
求解从1到n的素数（质数）集合/** * 获取n以内的所有素数 * @param n： */let primeNumbers = function (n){ if(n<1){ return [] } let primes=[] for(let i=3;i<=n;i++){ if(isPrimeNumber(i)){ primes.push(i) } } return primes}/** * 判断一个数是否为素数 * @param n 数据
2020-11-04 12:22:18
1189
原创 微信小程序button修改边框样式after
这里写自定义目录标题在微信小程序中，有些功能必须使用button组件（例如：获取用户手机号 (bindgetphonenumber)，微信小程序文档官方传送门）,如果使用view等组件，然后设置这个属性，点击是无法触发微信手机号授权的，必须使用button组件 我们接入button后 <button class='sure'>确定</button>.sure{ border-radius: 20px;}效果如下 可以看到边框有灰色的细线，当我们把.s
2020-10-30 17:54:44
2535
原创 canvas书写图片并修改尺寸
记录一下两年前的一个关于canvas设置手写签名的需求，最近又对其进行了改造第一版的需求如下：由于手写区域较大，部分用户手写的区域较小，在盖章的过程中，可能会使得签名笔迹看起来特别小，我们需要将用户真实手写的笔迹进行区域裁剪，得到红框中的部分，使得该图片在盖章展示的时候能看清用户的笔迹分析设计：1.由于需要对canvas中已经手写的笔迹进行处理，且手写区域是固定的，一次需要再有一个canvas（adjustCanvas）来处理 2.需要将用户的手写笔...
2020-08-24 18:39:44
2474
转载 网页获取微信版本号
H5网页获取微信版本号直接上代码// 判断是否在微信浏览器中打开function is_weixn(){ var ua = navigator.userAgent.toLowerCase(); if(ua.match(/MicroMessenger/i)=="micromessenger") { return true; } else { return false; }}getWechatVertion(){ var ver
2020-08-05 10:34:15
1729
原创 react-native-webview网页拨打电话
问题描述在使用ReactNative开发过程中，使用了WebView来加载公司的市场宣传网页，并且在页面上设置了手机号<a>标签，但是在应用中点击网页上的这个链接后，报错“net::ERR_UNKNOWN_URL_SCHEME”tel://11011112222环境说明react-native-webview版本号：9.3.0解决方法设置Webview的onNavigationStateChange函数，当其为“tel://”协议时，使用Linking跳转，并.
2020-08-05 10:10:41
468
原创 Android打包移除assets中的文件
背景由于需要给厂商提供一个aar包，里面有一个json文件在assets中，在他们项目中，这个json配置文件会有影响，因此需要指导对方在集成的时候将这个json文件打包时候移除。由于delete的是merge之后的assets文件夹内容，因此在aar包中的也同样会受影响，在最后的apk中可以查看添加这项配置之后，该文件被移除了。直接上代码android.applicationVariants.all { variant ->// if (variant.buildT
2020-07-16 15:47:53
4050
1
原创 JS节流实现-支持多个函数同时调用
JS节流说明：限制一个函数在一定时间内只能执行一次之前有关于JS防抖函数的实现，可以见JS防抖函数支持多个函数调用本文采用的是定时器方式进行节流，且可以同时支持多个函数的调用说明：md5_hex方式是md5算法对数据进行hash，可以自行下载https://download.csdn.net/download/u010899138/12614308throttle函数立即执行，适用于页面进入后立即加载数据，在wait时间内，fun的调用不会再执行调用示例// 默认执行...
2020-07-15 10:21:19
2638
原创 JS防抖函数支持多个函数调用
关于js的防抖，业界有lodash函数工具库可以参考，也有很多同学提供了setTimeout的方式进行处理。不过就工具类是否使用以及使用哪一方的，都和个人以及团队的喜好相关，我们更关注其原理而非工具本身。本文根据setTimeout的机制进行了调整，用以适用在公司项目开发中，提供以下方法说明：其中1.debounce函数立即执行，适用于页面进入后立即加载数据，在wait时间内，fun的调用不会再执行调用示例// 默认执行后，在1500毫秒内再次执行只会输出一次debounceCo
2020-07-14 15:31:55
895
原创 网页跳转微信小程序
需求说明在微信公众号内的网页跳转到小程序完成业务功能，并在功能完成后关闭小程序。要点分析微信公众号可以在菜单中配置跳转小程序，但微信没有提供相关api直接跳转 微信中的网页可以长按图片并识别图片内容 微信可以通过普通链接二维码图片跳转到小程序（见微信扫普通链接二维码进入小程序） 小程序完成业务后，需要及时关闭，采用navigator组件进行关闭退出小程序方法可以参考微信的官方文档https://developers.weixin.qq.com/miniprogram/dev/comp
2020-07-14 14:21:19
5523
5
原创 MacBook网络连接正常无法访问网页
症状：网络连接正常，可以登录微信和接受发送消息，但是在浏览器上打开网页出现异常，并提示无法连接服务，请检查网页代理。问题检查进入系统偏好设置->网络->高级->代理，检查代理设置，发现网页代理和安全网页代理勾选了配置，并且代理服务器是指向127.0.0.1本机。修正方案：将网页代理和安全网页代理移除勾选，并将自动代理配置勾选上，保存后应用，网页访问正常...
2020-07-10 10:45:28
8403
3
转载 Mac下面通过双击执行shell脚本
编写shell脚本run.sh 将run.sh修改为run.command 执行以下命令给文件赋予可执行权限 chmod +x run.command 完成，此时双击run.command文件即可执行shell中的命令，同时会唤起Terminal ...
2020-05-07 11:40:44
2996
转载 React.Component浅析
React当前已经更新到了16版本，以下内容基于该版本进行解析。概览React 的组件可以定义为 class 或函数的形式。class 组件目前提供了更多的功能，这些功能将在此章节中详细介绍。如需定义 class 组件，需要继承React.Component：class Welcome extends React.Component { render() { retur...
2020-04-21 16:54:58
906
md5.js-javaScript
2020-07-14
web静态网页-课堂作业
2013-06-06
图书管理系统需求分析规格说明书
2013-05-30
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人