- 博客(55)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 【React-Native】- 红米/安卓手机Text文字显示不全及全局字体
文章目录前言方案一：更换手机字体方案二：重新封装Text组件方案三：覆盖Text组件的render方法前言提示：这里可以添加本文要记录的大概内容：由于Android 手机厂商很多，不像 iPhone 只有一家公司，默认字体是不统一的。这时候如果组件没有设置字体，就会使用手机的默认字体。而有些字体，比如 “OnePlus Slate”、“小米兰亭pro” 在使用 Text 组件渲染的时候，就会出现被遮挡的问题提示：以下是本篇文章正文内容，下面案例可供参考方案一：更换手机字体方便快捷，但可控制
2022-05-23 17:04:58
2132
原创 【React-native】页面禁用右滑（物理）返回
文章目录前言一、BackHandler组件引入二、添加监听三、移除监听前言提示：这里可以添加本文要记录的大概内容：例如：使用app时我们会习惯性的使用自带的右滑返回到上一页面，但由于有时使用弹窗相关组件，右滑返回页面是返回到了上一页面，但是弹窗并没有关闭，因此需要对返回事件进行监听提示：以下是本篇文章正文内容，下面案例可供参考一、BackHandler组件引入import { BackHandler } from 'react-native';二、添加监听componentDidMou
2022-05-11 17:18:25
1768
原创 【Taro开发】-全局自定义导航栏适配AtMessage位置及相关问题（十四）
Taro小程序开发 系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参及页面事件调用（二）【Taro开发】-taro-ui（三）【Taro开发】-带token网络请求封装（四）【Taro开发】-自定义导航栏NavBar（五）【Taro开发】-formData图片上传组件（六）【Taro开发】-封装Form表单组件和表单检验（七）【Taro开发】-tabs标签页及子组件的下拉刷新（八）【Taro开发】-简易的checkBoxGroup组件（九）【Taro
2022-04-20 16:17:12
2309
原创 前端知识点整合
文章目录一、css1.相对定位和绝对定位（2022/4/14）2.背景图片3.限制文本长度显示省略号4.opacity透明度覆盖子元素5.js修改css变量二、js1.js数据类型（2022/4/14）2.== 与===的区别（2022/4/14）3.深拷贝和浅拷贝（2022/4/14）4.防抖和节流（2022/4/14）5.词法作用域（Lexical Scopes）（2022/4/14）6.闭包与内存泄漏（2022/4/14）6.1闭包的形成与作用6.2内存泄漏一、css1.相对定位和绝对定位（20
2022-04-14 21:12:26
392
原创 【Taro开发】-小程序自动打包上传并生成预览二维码（十三）
Taro小程序开发 系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参及页面事件调用（二）【Taro开发】-taro-ui（三）【Taro开发】-带token网络请求封装（四）【Taro开发】-自定义导航栏NavBar（五）【Taro开发】-formData图片上传组件（六）【Taro开发】-封装Form表单组件和表单检验（七）【Taro开发】-tabs标签页及子组件的下拉刷新（八）【Taro开发】-简易的checkBoxGroup组件（九）【Taro
2022-04-07 11:41:16
940
原创 常用Es6(5之后）的正确打开方式
文章目录1.取值-解构赋值2.扩展运算符和Set3.includes4.精确搜索5.可选链操作符6.空值合并运算符7.异步函数8.三目运算符9.扁平化数据10.for of1.取值-解构赋值const obj = { a:1, b:2, c:3, d:4, e:5,}//es5const a = obj.a;const f = obj.a + obj.d;//es6const {a,b,c,d,e} = obj;const f = a + d;
2022-04-01 15:13:00
2234
原创 【Taro开发】-分享给好友/朋友圈（十二）
Taro小程序开发系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参及页面事件调用（二）【Taro开发】-taro-ui（三）【Taro开发】-带token网络请求封装（四）【Taro开发】-自定义导航栏NavBar（五）【Taro开发】-formData图片上传组件（六）【Taro开发】-封装Form表单组件和表单检验（七）【Taro开发】-tabs标签页及子组件的下拉刷新（八）【Taro开发】-简易的checkBoxGroup组件（九）文章目录T
2022-04-01 13:30:26
4454
原创 【Taro开发】-宣传海报，实现canvas实现圆角画布/图片拼接二维码并保存（十一）
Taro小程序开发 系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参及页面事件调用（二）【Taro开发】-taro-ui（三）【Taro开发】-带token网络请求封装（四）【Taro开发】-自定义导航栏NavBar（五）【Taro开发】-formData图片上传组件（六）【Taro开发】-封装Form表单组件和表单检验（七）【Taro开发】-tabs标签页及子组件的下拉刷新（八）【Taro开发】-简易的checkBoxGroup组件（九）【Taro
2022-04-01 13:03:53
4977
3
原创 【Taro开发】-页面生成二维码及保存到本地（十）
Taro小程序开发系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参及页面事件调用（二）【Taro开发】-taro-ui（三）【Taro开发】-带token网络请求封装（四）【Taro开发】-自定义导航栏NavBar（五）【Taro开发】-formData图片上传组件（六）【Taro开发】-封装Form表单组件和表单检验（七）【Taro开发】-tabs标签页及子组件的下拉刷新（八）【Taro开发】-简易的checkBoxGroup组件（九）文章目录T
2022-04-01 11:35:35
1555
原创 【Taro开发】-简易的checkBoxGroup组件（九）
Taro小程序开发系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参及页面事件调用（二）【Taro开发】-taro-ui（三）【Taro开发】-带token网络请求封装（四）【Taro开发】-自定义导航栏NavBar（五）【Taro开发】-formData图片上传组件（六）【Taro开发】-封装Form表单组件和表单检验（七）【Taro开发】-tabs标签页及子组件的下拉刷新（八）文章目录Taro小程序开发前言1.checkBox组件2.checkBo
2022-03-31 23:58:45
1622
原创 【Taro开发】-tabs标签页及子组件的下拉刷新（八）
Taro小程序开发系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参及页面事件调用（二）【Taro开发】-taro-ui（三）【Taro开发】-带token网络请求封装（四）【Taro开发】-自定义导航栏NavBar（五）【Taro开发】-formData图片上传组件（六）【Taro开发】-封装Form表单组件和表单检验（七）文章目录Taro小程序开发前言一、tab栏吸顶效果二、标签页触底加载更多1.tabs组件2.tabs组件的使用及页面子组件前言
2022-03-31 23:34:35
3290
2
原创 【Taro开发】-封装Form表单组件和表单检验（七）
Taro小程序开发系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参（二）【Taro开发】-taro-ui（三）【Taro开发】-带token网络请求封装（四）【Taro开发】-自定义导航栏NavBar（五）文章目录Taro小程序开发前言1、异步校验机制2、 FormItem组件3、Form组件4、校验规则5、使用前言基于Taro的微信小程序开发，主要组件库为Taro-ui。formItem组件需满足前后缀，是否必填，校验提示。form组件需能在s
2022-03-23 17:33:57
3235
原创 【Taro开发】-formData图片上传组件（六）
Taro小程序开发系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参（二）【Taro开发】-taro-ui（三）【Taro开发】-带token网络请求封装（四）【Taro开发】-自定义导航栏NavBar（五）文章目录Taro小程序开发前言一、图片上传1. 常量定义2. 手动拼接FormData字符串3. 接口调用二、ImgPicker组件1.组件代码2.组件使用前言基于Taro的微信小程序开发，主要组件库为Taro-ui由于小程序里没有FormDat
2022-03-23 17:08:35
2695
原创 【Taro开发】-自定义导航栏NavBar（五）
Taro小程序开发系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参（二）【Taro开发】-taro-ui（三）【Taro开发】-带token网络请求封装（四）文章目录Taro小程序开发前言1.前提准备：utils/util适配不同机型2.NavBar组件3.样式4.使用前言基于Taro的微信小程序开发，主要组件库为Taro-uiTaro-ui：基于 Taro 开发 UI 组件一套组件可以在 微信小程序，支付宝小程序，百度小程序，H5 多端适配运行（
2022-03-23 15:36:36
4420
原创 【React】-子组件暴露类实例方法
//子组件暴露整个类实例import { Component } from "react";import { View, Text, Image } from "@tarojs/components";class Child extends Component { constructor() { super(); } componentDidMount() { this.props.refs(this) } say(){ console.log('11
2022-03-23 11:44:18
1548
原创 【Taro开发】-带token网络请求封装（四）
Taro小程序开发系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参（二）【Taro开发】-taro-ui（三）文章目录Taro小程序开发前言1.新建文件夹及文件2.apiConfig3.httpService4.使用前言基于Taro的微信小程序开发，主要组件库为Taro-uiTaro-ui：基于 Taro 开发 UI 组件一套组件可以在 微信小程序，支付宝小程序，百度小程序，H5 多端适配运行（ReactNative 端暂不支持）提供友好的 API
2022-03-11 14:43:44
3479
2
原创 【Taro开发】-taro-ui（三）
Taro小程序开发系列文章的所有文章的目录【Taro开发】-初始化项目（一）【Taro开发】-路由传参（二）文章目录Taro小程序开发前言1.安装2.使用3.编译报错前言基于Taro的微信小程序开发，主要组件库为Taro-uiTaro-ui：基于 Taro 开发 UI 组件一套组件可以在 微信小程序，支付宝小程序，百度小程序，H5 多端适配运行（ReactNative 端暂不支持）提供友好的 API，可灵活的使用组件提示：以下是本篇文章正文内容，下面案例可供参考1.安装yarn
2022-03-11 10:55:06
2420
原创 【Taro开发】-路由传参及页面事件调用（二）
Taro小程序开发系列文章的所有文章的目录文章目录Taro小程序开发前言一、路由配置二、路由跳转3.路由传参4.获取参数前言基于Taro的微信小程序开发，主要组件库为Taro-ui提示：以下是本篇文章正文内容，下面案例可供参考一、路由配置app.jsxconfig={ pages:[ 'pages/index/index',//第一项默认为首页 'pages/test/test' ]}二、路由跳转//跳转到 tabBar 页面，并关闭其他所有非 tabB
2022-03-10 16:56:34
2198
原创 【Taro开发】-初始化项目（一）
Taro小程序开发系列文章的所有文章的目录文章目录Taro小程序开发前言一、初始化1. 使用yarn/npm安装脚手架2. 创建模版3. 编译启动二、配置1.h5端修改服务路径2.多端调试3.alias别名设置前言基于Taro的微信小程序开发，主要组件库为Taro-ui提示：以下是本篇文章正文内容，下面案例可供参考一、初始化1. 使用yarn/npm安装脚手架//yarn/node需提前安装npm install -g @tarojs/cliyarn global add @tar
2022-03-10 16:21:55
2382
1
原创 【React-native】 实现页面中间部分吸顶效果
在FlatList 和ScrollView 中有一个stickyHeaderIndices 可以轻松实现吸顶效果例如：<ScrollView showsVerticalScrollIndicator={false} style={styles.container} stickyHeaderIndices={[0]} />表示 ScrollView 的 第一个子元素 上滑时 吸顶...
2022-02-18 17:09:53
1905
2
原创 【React-native】WebView 高度和图片宽度自适应
import { WebView } from 'react-native-webview';this.state = { webViewHeight: 0}onWebViewMessage = (event) => { this.setState({ webViewHeight: Number(event.nativeEvent.data) });}<WebView style={{//外层用scrollView需在本身设置宽高
2022-02-15 11:05:12
1970
原创 【React-Native】使用antv/f2折线图/饼图
最近在写一个RN-app项目，需要用到折线图和饼图，原本是使用第三方echarts，使用发现折线图无法在安卓机显示，饼图虽能显示，却不能更新数据，最终决定改用阿里的antv/f2可视化库。文章目录前言一、前提准备二、代码步骤1.新建f2chart.html2.charts.js加载js脚本3.renderChart.js4.使用效果图前言思路：使用react-native-webview加载本地html文件。提示：以下是本篇文章正文内容，下面案例可供参考一、前提准备安装react-na
2021-12-01 14:58:01
1528
原创 vsCode相关使用记录
在使用路径别名（@）后，我们的插件（path-intellisense）将不支持自动提示。解决方法：`//setting.json中添加“path-intellisense.mappings”: {“@”: “${workspaceRoot}/src”}`
2021-11-05 09:41:07
420
原创 【React-Native】批量引入svg并导出脚本
文章目录前言一、新建一个js文件用于生成导出文件二、使用及其注意事项1.使用2.注意事项前言在Rn中无法直接引用svg图片，我们习惯用react-native-svg或react-native-svg-transformer来帮助我们使用svg图片。用法：import About from './svg/about.svg';<About width={10} height={10} />由于每个svg图片都需要引入，就会造成每个页面代码都是一大串的svg引入。因此想写一个文.
2021-11-04 20:30:54
490
原创 git相关
1.大小写敏感//查询大小写是否敏感git config --get core.ignorecase//设置大小写敏感git config core.ignorecase false
2021-10-26 09:49:52
333
原创 svg无法占满屏幕
问题描述：使用svg作为背景时，发现容器可以占满，但svg无法铺满整个容器解决方案：打开svg图片，然后在svg标签上面加上属性：preserveAspectRatio="none meet";<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 375 250" preserveAspectRatio="none meet">...
2021-10-26 09:44:34
1860
原创 JS题目记录
JS题目记录文章目录JS题目记录一、字符串转驼峰模式一、字符串转驼峰模式如：’wo-shi-tuo-feng‘转成‘woShiTuoFeng’思路：1.根据-划分字符串2.遍历单词数组，转换单词首字母（注意为空去除）3.拼接新的字符串function convertToCamelCase(str) { // 去除中划线分隔符获取单词数组 var strArr = str.split('-'); // 如果第一个为空，则去掉 if(strArr[0] ===
2021-10-21 10:50:45
75
原创 npm install报错no template named ‘remove_cv_t’ in namespace ‘std’； did you mean ‘remove_cv’? - Stack O
node.js - error: no template named ‘remove_cv_t’ in namespace ‘std’; did you mean ‘remove_cv’? - Stack Overflow使用npm install或yarn install时一直报错，翻了好久百度才发现是依赖中 node-sass 的版本不支持 Node.js16 ，只能在 15 及以下的环境下运行，通过 node 版本控制器 n 对使用的 node 进行降级就可以正常安装 node-sass ，安装
2021-10-01 14:36:01
4759
原创 Mac小白之重启终端后command not found: nvm
文章目录前言一、遇到的问题二、解决办法1.配置 .bash_profile 文件2.配置 .zshrc 文件前言一个前端，在拿到mac的第一件事，肯定是先装上node，而node必不可少的就是先装nvm来管理node版本，这里附上一个nvm安装教程提示：以下是本篇文章正文内容，下面案例可供参考一、遇到的问题当前安装 nvm 成功了，但是每次关闭终端后，都需要重新执行 source .bash_profile 才能重新使用 nvm 命令，否则提示 commond not found:nvm二、
2021-09-25 20:46:08
3696
5
原创 React-Native踩坑记录
一、项目运行时，node窗口闪退导致红屏报错二、图片的另一种引入方式三、报错Invariant Violation: requireNativeComponent: "RNCSafeAreaProvider" was not found in the UIManager.四、报错Transform's input file does not exist: D:\Projects\react-native\testNew\node_modules\react-native-reanimated\andr
2021-09-03 10:13:47
2047
原创 css-数量不定的盒子换行
1.实现效果2.思路由于不确定一行有几个标签，因此不能采用:nth-child(3n + 3) { margin-right: 10px; }实现代码参考：.box{ margin: 10px 5px 5px 10px; .tag{ margin-right: 5px; margin-bottom: 5px; } :nth-last-child(1){ margin-right: 0px !import
2021-06-25 11:39:43
454
原创 js—数组过滤及树形数组的一些应用
文章目录一、数组过滤1.filter字符串包含某个字符2.forEach_indexOf数组去重（id值相同）3.双重for循环_splice数组去重（key相同）4.for_indexOf数组去重二、树形数组1.默认选中_返回树形中所有被选中的id数组2.被取消且原本为选中的提示：以下是在之前写项目的时候应用过的一些小栗子，仅供参考一、数组过滤1.filter字符串包含某个字符selectedRowKeys.filter((item: any) => item.includes('.ps.
2021-06-11 11:03:15
522
原创 【React】- Antd tree树形组件前、后缀图标
文章目录一、antd官网二、代码1.实现效果2.读入数据一、antd官网antd官网树形控件API二、代码1.实现效果2.读入数据代码如下（示例）：import { Tree, Switch } from 'antd';//引入//需要的图标const baseIcon = <SVGIcon iconClass={'baseIcon'} width={14} height={14}></SVGIcon>;const departIcon = <SVGI
2021-06-11 10:25:52
4736
1
原创 React-全屏、取消全屏及自适应防抖处理
文章目录前言一、html部分二、ts/js1.全屏事件2.取消全屏及防抖处理前言有些时候，我们需要在浏览器窗口发生变化的时候，动态的执行一些操作，比如做全屏，取消全屏及自适应页面时的适配。一、html部分//需要全屏的盒子<div className={styles.box} id='box'> {screens}</div>//全屏事件<div className={styles.btn} onClick={() => ful.
2021-06-01 09:42:25
1166
原创 ts对象成员设置初始值为空赋值为number
项目场景：在编写项目表单的时候，我们经常会使用到下拉选择器，对于选择器value的值一般为string或number类型，此次是为number类型的问题问题描述：在使用ts的对象成员时，必须对其赋初值，否则不能使用如batchMes.varietyId或对对象内不存在的值赋值。const [batchMes, setbatchMes] = useState({ batchName: '', batchNum: '', batchMeasure: 0, breedF
2021-05-12 09:42:50
16373
原创 antd-select选择器模糊查询
设置title<Select.Option value={item.landId} title={item.landName} key={item.landId}>{item.landName}</Select.Option>2.设置showSearch及 filterOption <Form.Item label={'所属地块'} name="landId" rules={[..
2021-05-12 09:11:02
1912
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人