- 博客(51)
- 资源 (7)
- 收藏
- 关注
RSS订阅原创 React Hooks：从“这什么鬼“到“真香“的奇幻之旅
短短十几行代码，完成了以前需要几十行class组件才能实现的功能。没有this，没有生命周期方法，代码简洁得令人发指。这到底是怎么做到的？函数组件凭什么突然这么强大了？带着这些疑问，我开始了Hooks的探索之旅...
2025-05-10 10:47:01
325
原创 使用 React Native实现鸿蒙开发的详细方案
通过以上方案，您可以系统性地将 React Native 应用迁移到鸿蒙平台或开发新的跨平台应用。随着官方支持的不断完善，建议定期检查项目依赖版本更新。
2025-05-09 12:17:43
396
原创 Flutter vs React Native：跨平台开发的终极对决
不过，Facebook正在用**新架构（Fabric & TurboModules）**优化这个问题，未来可能缩小差距。如果你是一名移动端开发者，或者正准备踏入跨平台开发的世界，这个问题一定让你头疼过。它的UI构建方式非常直观，但前提是——你得先适应它的思维方式。希望这篇文章能帮你少走弯路，做出最适合你的选择！Flutter不依赖平台原生控件，而是用。如果你熟悉React，上手会非常快。，基础APK可能比RN大3-5MB。本文将抛开营销话术，从。等多个维度，帮你做出。跨平台开发的世界里，
2025-05-09 12:07:33
326
原创 《React Native热更新实战：用Pushy打造无缝升级体验》
审核周期长：苹果App Store平均审核时间24-48小时用户更新率低：仅有30%用户会在第一时间更新紧急修复无门：重大BUG只能眼睁睁看着用户流失在这个移动互联网的"快鱼吃慢鱼"时代，Pushy这样的热更新方案已经不再是锦上添花，而是生存必需品。时间掌控：将BUG修复时效从天级缩短到分钟级风险控制：通过灰度发布把影响范围降到最低用户体验：实现真正的无缝更新，告别强制弹窗但记住那句老话：“能力越大，责任越大”。
2025-05-08 13:19:01
1473
原创 《React Native性能优化：从卡顿到丝滑的蜕变之旅》
当你看到优化后的应用如丝绸般顺滑地运行，那种成就感堪比程序猿版的"登上珠穆朗玛峰"。但请记住，性能优化不是一锤子买卖，而是一种需要融入日常开发习惯的思维方式。就像著名计算机科学家Donald Knuth所说：“过早优化是万恶之源”，但我们也别忘了后半句：“但对效率的追求永不过时”。关键在于找到平衡点——不过度设计，也不忽视明显的性能隐患。下次当你手指滑动应用却遭遇卡顿时，不妨停下来思考：这里的瓶颈在哪里？是JavaScript线程过载？是UI线程阻塞？还是内存泄漏？
2025-05-08 12:47:35
1132
原创 React Native主题切换、字号调整：不用styled-components也能玩出花
“你知道吗？只用React Native自带的工具，不到100行代码就能实现媲美大厂App的主题、字号切换效果！” 作为一个被产品经理反复要求"加个深色模式"的前端码农，我曾经也以为非得用styled-components这类库才能优雅地管理主题——直到我发现React Native自己就藏着这么一套"秘密武器"。
2025-05-07 16:21:13
975
原创 JavaScript性能优化：从青铜到王者的进阶之路
当一位资深前端攻城狮发现即使使用了React最新特性，页面滚动时依然出现明显卡顿，性能分析工具显示JavaScript执行时间长达300ms——这个数字足以让任何追求极致的程序猿夜不能寐。我将向各位猿友揭示那些书本里不会告诉你的JavaScript性能优化实战技巧，从V8引擎的隐藏特性到浏览器渲染管线的深度调优，我们将一起探索如何让代码跑得比高铁还快。，这背后究竟隐藏着怎样的引擎优化秘密？让我们拭目以待！
2025-05-07 10:55:43
790
原创 突破测试环境文件上传带宽瓶颈！React Native 阿里云 OSS 直传文件格式问题攻克二
我们对服务端和阿里云oss的配置及前端调用做了简单的介绍，但是一直报错。最终判断是文件格式问题，通常我们在reactnative中用formData上传，这里的file是文件的本地路径，如"file://android_asset/文件名"，这里注意file://在安卓选择后并没有，需要我们来进行添加。但事实证明这里并不能直接通过路径上传，而是需要对文件进行处理，转为二进制数据，我们这里选择的是'rn-fetch-blob'库。
2025-05-01 09:46:30
700
原创 富文本无法解析，处理标签＜spanyes＞解决问题
展示富文本时出现无法解析的问题，查看文本片段发现其中spanyes标签是无法解析的关键因素。将spanyes';替换为span style="， ="" 是冗余字符直接替换为""。如还有问题，查看有没有其他问题标签一并替换为正确的标签即可。以上方法处理后，问题迎刃而解。替换文本中有问题的标签。
2025-04-30 22:16:49
131
2
原创 突破测试环境文件上传带宽瓶颈！React Native 阿里云 OSS 直传文件格式问题攻克一
通常情况下，作为前后端分离的项目来说，文件上传是最寻常的功能之一。虽然每个公司选择的文件管理云库各不相同，但实现思路基本一致。我所在公司使用阿里云oss文件管理，之前服务端做了透传，但是由于每个测试环境的带宽限制，导致在测试环境出现文件上传受限的问题。因此，痛定思痛，决定抛开中间层，直传阿里云OSS。
2025-04-30 20:59:21
1166
原创 测试68问
这类题目就是考测试工程师的基本能力了，比如测试计划，测试流程，如何bug，你做过哪些测试，一般我们认为这些能力做的再好都是应该的，不会有加分，但是只要做的不好，那就是个不合格的测试工程师了。如今是移动互联网的天下，谁家没有个应用，所以这一块基本都会问到，同时也会看你的简历，如果你没有做过，基本也不会问的太深，如果你是专门做这一块的，那么要好好准备了。这一块包括，自动化一些理念和自动化的工具使用。什么都离不开服务端，所以这是你逃不开的，一般来说服务端会问接口测试，性能测试，更深一点，埋点监控止血也会有。
2023-06-28 10:55:59
164
原创 测试用例三问三答
评审之前，需要将要评审的测试用例以及测试需求分析的结果（测试点分析）等文档提前发送给相关的人员；评审会议的主持者需要能够把控会议的进度，让参加评审的测试人员能够集中精力在测试用例上，而不要思维太发散而跑题。评审会议的主持者，需要事前做好关于测试用例的疑问，问题点等记录，以便于在评审会上引导提问和解答；评审会议结束之后，及时提交审核评审记录；并且与参加会议的人员分享评审记录。评审之前做足问题的沟通与反馈，以便于在评审会上节省时间；评审期间做好详细的记录，需要对有关的疑问和问题及时进行解释说明；
2022-09-26 15:59:15
666
原创 RN中view循环列表分割线时有时无的解决方法
前奏相信很多使用react-native开发app的朋友都有过这样的经力，使用View循环渲染的列表，有时候无法显示分割线，可明明都加的是borderBottomColor 和borderBottonWidth,还是有一些不显示，真实汗颜~，废话不多讲，安排~解决方案：通过多次排查，发现我们在样式中加了高度height，并且用了封装的px2dp像素转换的方法，导致计算出现了偏差，这时候主要不去使用px2dp即可解决问题！px2dp方法：const { width: screenWidt
2022-03-02 14:16:00
431
原创 React被废弃的三个生命周期函数及替代函数
前奏学习react的看官都知道，react生命周期函数贯穿于组件的初始化、挂载、更新、销毁的整个过程，可以说配合紧密，但随着react使用的深入，在业务开发中一些声明周期函数也带来了一些严重的问题，因此官方大大也很快做出了修正，废弃了几个容易造成严重问题的函数，并且给出来替代的函数。react精益求精的“弃子”1、componentWillMount2、componentWillUpdate3、componentWillReceiveProps原因在 componentWillMou
2022-01-25 10:51:23
4273
原创 react native TextInput输入限制字数长度在安卓和iOS设备上部分系统键盘输入问题
安卓和iOS很多机型上在输入汉字的过程中会出现将字母（拼音）先输入到输入框中参与计算，一般情况下不会有问题，但如果要做字数限制时问题就出现了。例如，限制只能输入10个字符。大部分人的做法是给TextInput加MaxLength={10}来限制字数，这看起来也十分合情合理，没有任何怀疑，毕竟这是官方提供的属性方法。但恰恰是这个属性导致在输入时出现超界问题。比如下图中，当先输入6个汉字，再输入2个字“测试”的时候，拼音字母 "cesh" 参与计算，已经达到了限制的10个字符，因此导致无法输入10个汉字就不能在
2022-01-21 11:39:14
4780
2
原创 封装react-native组件开源到npm
前奏做前端也有一段时间了，封装了大大小小很多的组件，至今自己都有点想不起来了有哪些了，但都是在项目代码里面。如果想跨项目使用，要用的时候需要一个个项目去翻找，还必须copy代码过去，着实头痛。近期，恰逢公司要求封装独立的组件系统供各个系统标准化调用。这才开始将现有组件逐一进行发布。当然，公司使用的内网，这里是我经过修改后，开源后方便自己之余以供大家参考。tips: 这里将采用第三方的插件（react-native-create-library）来进行快速集成（毕竟重复造轮子的事情，不是我们这些懒
2022-01-19 18:53:18
2426
原创 完美解决RN中ScollView包含多个TextInput手指触摸到Textinput区域内上下滑动失效的问题
完美解决RN中ScollView包含多个TextInput手指触摸到Textinput区域内上下滑动失效的问题
2022-01-17 19:36:23
2344
1
原创 攻克小米10等机型文字截断问题：React Native优雅适配部分安卓机型文字显示不全策略
相信和我一样使用react-native开发app的猿友，都会遇到很多兼容问题。那么大家有没有遇到过小米10及其他部分机型出现<Text></Text>组件中的文字 显示不全（结尾的文字 不显示）的问题。这个问题困扰了我很久，今天终于解决了。废话少说，直接上干货。
2021-03-26 23:05:41
2088
2
原创 React-Native热更新codepush
React-Native热更新安装环境：React-native 0.63.3React-native-code-push 0.6.3全局安装App Center CLI第一步全局安装appcenter的脚手架，通过npm安装，（国内用户可能会比较慢，请添加淘宝镜像）npm install -g appcenter-cli登录appcenter* 首次登录执行appcenter login 数秒后会打开浏览器，需要先登录，登陆后显示授权码，复制授权码粘贴到终端回...
2020-12-22 18:59:20
582
原创 前端简单文件上传方法
//公共方法export function fetchUpload(url, file){ const formdata = new FormData(); formadata.append("file", file); return new Promise((resolve, reject) = > { fetch().then(response => { ...
2020-05-29 15:50:47
504
原创 css样式中对button点击出现边框的问题最简单解决方法
有时候我们在给button添加了border-radius后，点击的时候按钮周围会有边框，体验非常不好，经过查询资料，解决办法为：IE浏览器：button:focus{outline: none} 或者 button:focus{outline:0}firfox火狐浏览器：button::-moz-focus-inner {border-color: transparent;}...
2020-05-28 09:26:54
2596
3
原创 jquery完美实现轮播图
CSS: .lunbo { padding: 0px 15px; margin-top: 20px; } .lunbo-wrap { width: 100%; height: 100px; overflow: hidden;...
2019-09-19 22:04:10
663
原创 前端识别二维码图片
来自：https://gitee.com/guyandog/QR_BR具体代码请下载 本站资源demoguyandog-QR_BR-master.zip 或者 guyandog-QR_BR-master -改动.zip如有不清楚的可以留言交流...
2019-07-25 00:34:12
1277
原创 h5轮播图 自动轮播
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X...
2019-06-15 01:33:27
7018
原创 web H5 首页引导图
向左滑动切换，最后一张图点击进入，进入首页<!-- <img src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=354250238,3380034834&fm=15&gp=0.jpg" alt=""> --><!DOCTYPE html><htm...
2019-06-10 10:17:26
2104
原创 响应式布局三步走
前言：制作响应式布局前，先开发固定尺寸的网页，当完成固定尺寸的网页后，在通过媒体查询为网页定制响应式布局第一步，引入meta<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">屏幕按1:1的尺寸显示并禁止用户缩放页面。&...
2019-05-14 10:44:05
964
转载 HTML5+通讯录获取指定多个人的信息
plus.contacts.getAddressBook(plus.contacts.ADDRESSBOOK_PHONE, function(addressbook) { //获取通讯录信息 for(var j = 0; j < username.length; j ) {//循环所选取的联系人，记得循环一定要放在这里，一开始我放在 plus.cont...
2019-05-06 14:06:04
1115
原创 Rect环状统计图工具类
由于公司项目需要，对可用金额和全部金额进行环状统计图统计，因此秉着不重复造轮子的信念，开始疯狂的度娘查询。例如ECharts 、 BizCharts 、G2都进行了考虑，不过由于项目中只需要单纯的环状图，所以如果将此插件引入项目，有点过于厚重，势必对项目性能造成一定的损失，so果断放弃。经过反复度娘筛选，最终确定用简书的一位简友的“使用JS绘制一个圆环统计图”，但公司用的reac...
2019-04-30 09:38:17
425
原创 input值变动自动触发事件
<!DOCTYPE html><html><head><meta charset="utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge"><title>自动改变颜色</title><meta name="vie...
2019-03-28 17:16:54
6162
转载 web前端开发之浏览器兼容
csshack 1 2 3 4 5 6 7 我很少使用hacker的，可能是个人习惯吧，我不喜欢写的代码IE不兼容，然后用hack来解决。不过hacker还是非常好用的。使用hacker我可以把浏览器分为3类：IE6 ；IE7和遨游；其他（IE8 chrome<br>ff safari opera等） ...
2019-01-14 09:31:20
376
原创 css动画淡入淡出
<!DOCTYPE html><html> <head><meta charset="utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge"><title>动画《淡入淡出》</t
2019-01-04 09:36:00
9907
原创 文字向上循环轮播滚动
<!DOCTYPE html><html lang="en"> <head><meta charset="UTF-8"><title>Document</title><style>* {margin: 0;padding: 0;}
2018-10-29 10:32:02
2951
原创 react滚动条开发 适配PC 和 移动端的滚动 显示隐藏header和footer/滚动显隐公用组件
功能描述：移动端时，上滚则显示footer,下滚则隐藏footerPC端时，上滚则显示header,下滚则隐藏header。 xx.jsimport React, { Component } from 'react';import {BrowserRouter as Router,withRouter,} from 'react-router-dom'; ...
2018-09-28 10:59:19
3180
转载 js常见的跨域方法及事例
转自：https://blog.youkuaiyun.com/wangchengiii/article/details/78081032备注：如果是协议和端口造成的跨域问题“前台”是无能为力的；要解决跨域的问题，我们可以使用以下几种方法：方法一、通过jsonp跨域JSONP包含两部分：回调函数和数据。回调函数：当响应到来时要放在当前页面被调用的函数。数据：就是传入回调函数中的json数据，也就...
2018-08-23 20:48:28
255
转载 快速构建react+webpack+es6项目的两种方式之二
转载自https://blog.youkuaiyun.com/pcaxb/article/details/52212367环境搭建:1.从官网下载最新版本的node.js安装官网下载地址:http://nodejs.org/en/官网需要翻墙,如果没有翻墙的同学可以到nodejs中文网下载,下载地址:http://nodejs.cn如果你需要使用Homebrew安装nodejs,请参...
2018-08-21 15:49:56
399
转载 快速构建react+webpack+es6项目的两种方式之一
本例转自https://blog.youkuaiyun.com/hahahhahahahha123456/article/details/80358381一、安装最新的node.js原博文是这样写说的npm install -g n //首先安装n模块 n stable //升级node.js到最新稳定版 n 5.0.0 //或者指定版本升级 node -v //检查更新是否成功我自...
2018-08-21 15:47:05
312
转载 js web 前端图片优化之--图片压缩上传
转自： https://www.cnblogs.com/007sx/p/7583202.html//此方法写的非常好，本人已采用 <!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>XMLHttpRequest上传文件</title&
2018-08-13 23:17:29
2828
原创 react+webpack 打包，开发环境和生产环境集成一体拿来就能用
直接上代码：webpack.config.js import webpack from "webpack";import path from "path";var path = path.resolve(__dirname,"/main.j")var ExtractTextPlugin = require("extract-text-webpack-plugin");//c...
2018-08-11 19:52:25
2617
android自定义ViewGroup
2017-03-31
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人