2020年07月_hzxOnlineOk

转载关于React的setState的坑

this.setState如果需要修改this.state中的数据必须调用this.setstate这个方法这个方法里面有2个参数参数1：类型对象key是this.state中的key值val是修改后的数据参数2：类型函数 1、查看数据是否已经更新 2、可以获取到数据更新后的最新的DOM结构书写方案1：this.setstate({},()=>{})书写方案2：this.setstate(()=({}),()=>{})关于 setStat...

2020-07-31 09:28:08 754

转载 React Native ScrollView 包含TextInput组件的区域无法响应滚动事件

简述当ScrollView中包含TextInput，且TextInput的textAlign设置为right时，此时触摸到TextInput上面，拖动滑动会发现没有任何滑动效果，这是因为事件被TextInput消费掉了（具体可参见）。解决方案NumberInputimport React, {Component} from 'react';import {TextInput} from 'react-native';export default class NumberInpu.

2020-07-28 16:42:40 627

原创 justify-content: space-between；未生效？没有两端对齐

两种可能（1）忘记设置display: 'flex'display: 'flex';（2）父元素有伪元素，伪元素会阻碍flex属性的生效

2020-07-27 20:15:38 2316 2

原创 flex布局中使用 justify-content: space-between 中间图片为空处理

当我们使用flex布局时，会使用到平分间距 justify-content:space-between;就会出现下面这样的bug最后一排如果不满三个div，就会这样这个时候，只需要在父级元素使用一个伪类就能解决 :after{content:'',width:280px;}...

2020-07-27 19:54:37 1333 1

转载初学React-hooks 整理

Hook是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。React 16.8.0 是第一个支持 Hook 的版本。升级时，请注意更新所有的 package，包括 React DOM。 React Native 从0.59 版本开始支持 Hook。没有破坏性改动在我们继续之前，请记住 Hook 是：完全可选的。你无需重写任何已有代码就可以在一些组件中尝试 Hook。但是如果你不想，你不必现在就去学习或使用...

2020-07-26 12:39:49 236

转载 react native ios端 ScrollView滚动条显示在屏幕中间

场景软件版本 ios 13.3在ScrollView组件下，原本在最右侧的滚动条跑到了屏幕中间。解决方法给ScrollView加 scrollIndicatorInsets属性<ScrollView scrollIndicatorInsets={{ right: 1 }}>...</ScrollView>————————————————版权声明：本文为CSDN博主「不吃猫の鱼」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。

2020-07-24 17:17:38 1138

原创 TextInput组件在ios上自带输入法下无法输入中文（输入闪烁） ---- react-native 0.55.4

这个问题，是因为TextInput不能设置value或者defaultValue 和 onChangeText，否则会出现Ios无法输入中文的现象解决办法：一、参考https://www.jianshu.com/p/73df32483351二、使用loadsh的debounce防抖函数，限制过快的回调执行，js的函数防抖和节流参考https://www.cnblogs.com/youma/p/10559331.html...

2020-07-23 15:10:08 748

转载 http的请求体body的几种数据格式

转自：https://blog.csdn.net/qq_41063141/article/details/1015059561、multipart/form-data以表单形式提交，主要是上传文件用它，在http中格式为2、application/x-www-from-urlencoded以键值对的数据格式提交，当action为post时，浏览器将form数据封装到httpbody中，然后发送server。这个格式不能提交文件...

2020-07-21 20:59:34 2766

转载 Wireshark如何使用

官方英文文档https://www.wireshark.org/docs/wsug_html_chunked/wireshark抓包新手使用教程 Wireshark是非常流行的网络封包分析软件，可以截取各种网络数据包，并显示数据包详细信息。常用于开发测试过程各种问题定位。本文主要内容包括： 1、Wireshark软件下载和安装以及Wireshark主界面介绍。 2、WireShark简单抓包示例。通过该例子学会怎么抓包以及如何简单查看分析数据包内容。 3、Wireshark...

2020-07-17 11:17:51 349

转载 React Native项目 Native module RNFSModule tried to override RNFSModule for module name RNFS...

问题描述：Native module RNDeviceModule tried to override RNDeviceModule for module name RNDeviceInfo解决方案：MainApplication.java特别检查你的protected List<ReactPackage> getPackages();这RNDeviceModule可能是列表中的两倍。也就是说你MainApplication里面的link库重复了，删除重复的就可以了。配图：.

2020-07-09 19:19:00 534

原创 React-Native0.55版本 TextInput组件手动失焦

添加函数：_onPress()_onPress() { console.log("press"); this.refs.InputText.blur(); this.refs.Password.blur(); }背景使用<TouchableOpacity><TextInput ref={'InputText'}></TextInput><TextInput ref={'Password'}

2020-07-09 18:36:43 376

原创【MAC】brew install XXX一直卡在Updating Homebrew…的解决办法

提醒我们要更新watchman依赖包brew install watchmanbut! 命令执行后，下载速度超级超级超级无敌的慢，不能忍。隔着一堵墙在下载。。。5kb/s的下载速度谁能忍？于是，我查询了网上的一些方案，都叫我改镜像源，改成中科大或者阿里或者清华的镜像源emmm，似乎颇有道理，手动操作一波：操作过程中，如果有报如下错误，请用命令删除对应文件（因为文件已经存在，新下载的哈希值校对不上）：Already downloaded: /Users/username/.

2020-07-07 17:37:01 720 1

原创 macos系统和windows下node版本如何升级（转载）

爬坑后的结论：window系统升级node只能到node官网下载window安装包来覆盖之前的node。以下为我的爬坑之路：今天安装了vue cli 3，使用命令时报：You are using Node v8.4.0, but this version of vue-cli requires Node >=8.9.Please upgrade your Node version.然后再用node -v，发现在本地的node版本是v8.4.0，有点老了，要升级了。可是，node怎

2020-07-07 11:13:36 1825 1

原创 Unable to load script from assets‘index.android.bundle‘.Make sure your bundle is packaged correctly

上网查了一下，很多文章都提出下面的解决方法：方案一这个方案不通用，我的情况是，项目移植时，从仓库clone下来的代码、文件缺失了，按照原本的文件进行替换补充即可方案二1.首先手动在android/app/src/main目录下建立一个assets文件夹2.然后在项目的根目录下执行react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output ...

2020-07-06 10:24:35 281

原创 react-native 连接真机debugger时打包弹出报错 android - Waiting for Debugger 解决

如下图，这是在打包到android真机设备上时，由手机弹出的，一脸懵逼，不知道啥情况搜索了一下，发现并不是唯一解有人说，这是端口占用；有人说，需要clean项目，重启adb服务；有人说，这是 AS 开的太多了；有人说，在androidStudio顶部的菜单按顺序点击，Run —> Attach debugger to Android process然鹅，对我都没用后面看到评论区的各位给出的方案是：关闭再重开一遍开发者模式，行之果然有效...

2020-07-06 10:01:35 535

原创 The minSdk version should not be declared in the android manifest file.

在react-native项目解析android包的时候，报了个错误error:The minSdk version should not be declared in the android manifest file.这个错误如下图所示会显示在右下角。出现这个问题的原因是Androidstudio3.0 以后不能在manifest.xml设置这些，必须在 gradle里设置解决方案把manifest.xml里的sdk最小版本设置都删掉（此处参考了这篇文章https://blog.csdn...

2020-07-06 09:28:24 551 1

原创 XCode 移植项目异常处理检查事项记录

1、由于git仓库会忽略一些文件，导致一些应有的配置文件缺失（bin/.env.dev || .env.prod隐藏文件，Mac使用快捷键shift+command+.查看）（build/init.env.js || init.prod.js）2、Pod工具软件升级，升级后执行pod install3、git克隆下来的项目记得yarn或者npm下载node_modules包4、如果是XCode11 可能在模拟器上会出现Unknown argument type '__attribut

2020-07-02 16:10:53 169

原创调试移动端h5的新闻详情页对于空格pc谷歌浏览器调试的渲染效果与手机终端的渲染效果不同

我接到了一个需求，实现新闻列表以及对应的新闻详情这是一个react-native项目，但是要求用移动端h5开发详情页，打包成dist后，作为一个链接以供rn列表项点击跳转问题来了，详情页的内容会在后台系统填写一些空格格式，pc谷歌浏览器调试移动端h5对于空格的渲染和手机终端的app的webview上看到的空格渲染宽度不同，这直接导致了文案无法同步对齐有鉴于此，决定采用iframe去做展示...

2020-07-01 10:09:21 593 2

hzxOnlineOk的博客