- 博客(37)
- 收藏
- 关注
RSS订阅原创 expo-cli 项目中使用 react-navigation
下面的代码建立在 expo-cli 项目中使用 react navigation 5.0安装依赖包：yarn add @react-navigation/native// 安装 tab 导航yarn add @react-navigation/bottom-tabs// 安装 stack 导航yarn add @react-navigation/stack// 安装 iconsyarn add react-native-vector-icons将下面依赖安装到 expo 管理的项目中
2020-12-18 16:20:05
440
1
原创 git bash 配置
git bash 默认安装路径C:\Program Files\Gittmux 安装复制 tmux 文件，tmux | github。把 tmux 目录下的文件，复制到git bash下 对应的的usr/bin 和 usr/share 文件夹即可
2020-09-17 14:48:36
191
原创 antd 常见组件的样式修改
Select.ant-select-selection { /* 选择框 样式 */ border: none; border-bottom: 1px solid rgba(226,226,234,1); border-radius: 0;}.ant-select-selection.ant-select-selection--single { /* 选择框 click */ border: none; border-bottom: 1px solid rgba(226
2020-09-03 10:05:16
3558
2
原创 技术总结
puppeteerPuppeteer 是一个 Node 库，它提供了一个高级 API 来通过 DevTools 协议控制 Chromium 或 ChromePuppeteer API 是分层次的，反映了浏览器结构puppteer vs puppeteer-corepuppeteerpuppeteer-core浏览器 自动化的产品一个 库 来帮助驱动任何支持 DevTools 协议的东西安装后，自动下载一个版本的 chromium，然后使用puppeteer-co
2020-07-23 11:31:23
187
原创 快速创建 react 模板
打开 vscode 拓展工具搜索simple react snippets简单使用快捷键操作imrcimport React, { Component } from ‘react’;ccc生成 class 组件模板
2020-06-05 16:24:40
509
原创 关于 node-sass 报错的解决方法
报错原因：node-sass 被墙掉了一句命令解决：npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
2020-06-03 17:50:05
204
原创 win10 安装 nvm
下载地址downloadnvm-noinstall.zip： 绿色免安装版本，但是使用之前需要配置nvm-setup.zip：安装包，下载之后点击安装，无需配置就可以使用，方便。Source code(zip)：zip压缩的源码Sourc code(tar.gz)：tar.gz的源码，一般用于*nix系统这里我选择的是nvm-setup.zip安装前最好删除先已有的node下载后开始安装，这里我选择自定义安装目录D://nvm接下来就可以在cmd或者git bash中，nvm -v查
2020-06-03 17:49:15
343
原创 react 关于聊天框自动自动到滚动条底部
在滚动区域的底部添加一个 <a></a> 标签<div style={{ height: 0 }}> <a className="toBottom" name="1" href="#1" onClick={}> </a></div>每次获取完消息后，执行 <a></a> 标签点击事件document.querySelector('.toBottom').click()...
2020-05-09 11:49:55
1302
原创 antd Select 组件输入搜索 防抖
// importimport debounce from 'lodash/debounce'; // 导入 防抖函数的包// construcoterconstructor(props) { super(props); this.fetchSku = debounce(this.fetchSku, 800); // 使用防抖}state = { skuList: []...
2020-04-08 17:02:16
2339
原创 判断 Object 和 Array
之前一直通过type来判断数据类型但是会发现一个问题type无法用来判断具体是 数组还是对象下面是判断 数组 和 对象 相对正确的方法const isObjArr = val => { const type = Object.prototype.toString.call(val) if (type === "[object Array]") { console....
2020-04-02 10:08:37
210
原创 数组和对象的深拷贝
错误的拷贝方式state = { // constructor 构造函数中的 state array = ['0', '0', '0']}const newArray = this.state.arraynewArray[0] = '1'newArray // ['1', '0', '0']this.state.array // ['1', '0', '0']之前的...
2020-03-16 15:08:54
165
原创 ant design pro 路由的基础用法
router.config.js 中路由的基础设置{ path: '/hello', icon: 'block', name: 'Hello', Routes: ['src/pages/Authorized'], authority: ['free', 'vip'], // 权限 routes: [ { path: '/hello/a', ...
2020-03-10 16:10:26
1167
原创 表单——邮箱
<FormItem label="邮箱"> getFieldDecorator('email', { rules: [ { required: true, message: '邮箱不得为空' }, { pattern: /^[a-zA-Z0-9_-]+@[a-zA-Z...
2020-03-09 14:59:21
450
原创 数组对象去重
Es6 Set获取数组对象中指定的对象属性，得到新的数据，并且对其进行去重let people = [ { name: 'liu', age: 23, }, { name: 'cai', age: 24, }, { name: 'liu', age: 23, }]let list = []people.map(it...
2020-03-09 10:54:01
119
原创 判断数组是否为空
判断数组是否为空——错误的方法const arr = []if (arr) { console.log('true')} else { console.log('false')}// true为什么空数组为 true 呢？发现空数组展开里面还是有默认的属性判断数组是否为空——正确的方法if (arr && arr.length > 0) {...
2020-03-05 21:39:37
2120
原创 表格中，内容过长省略
import { Tooltip } from 'antd'const columns = [ { title: '名称', dataIndex: 'name', onCell: () => { return { style: { // 样式设置 maxWidth: 120, overflo...
2020-02-27 19:41:35
376
原创 表格的导出
前端生成表格，导出 excelimport { exportExcel } from 'xlsx-oc'; // 下载包 xlsx-oc ，并且引用const head = [ { k: 'name', v: '名称' }, { k: 'age', v: '年龄' }, { k: 'sex', v: '性别' }, ]const data = [ name: 'li...
2020-02-27 19:16:51
247
原创 www.baidu.com —> baidu
用字符串属性做提取let str = 'www.baidu.com'str.search('baidu')str.replace('www.', '')str.replace('.com', '')
2020-02-26 17:18:01
306
原创 map 出一个对象的属性 || 删除一个对象中的属性
const info = { name: 'liu', age: 23, sex: 'man',}Object.keys(info).map(item => { console.log(item) // 属性 console.log(info[item]) // 值})
2020-02-25 15:38:17
951
原创 小数转化成百分数
toPercentexport function toPercent(value) { let str = Number(value * 100).toFixed(2); // 百分数中的小数位数 str += '%'; return str;}
2020-02-25 14:35:25
619
原创 npm 镜像切换
临时使用npm --registry https://registry.npm.taobao.org install [需要安装的包]持久使用npm config set registry https://registry.npm.taobao.org使用 cnpmnpm install -g cnpm --registry=https://registry.npm.taobao.o...
2020-01-19 19:51:41
134
原创 deepin 终端配置
打开 Linux 终端快捷键：Ctrl+Alt+t更换下载源设置–>更新–>更新设置–>智能镜像源off–>切换镜像源(阿里源)sudo apt -get update下载 fishsudo apt-get install fish终端默认进入 fishwhich fish# 我的路径如下/usr/bin/fishchsh -s /usr/bi...
2020-01-11 20:02:07
1049
1
原创 loading 的使用
loading1. 传统的使用方式最开始写loading的时候是，在组件中设置state = { loading: false;};然后在数据请求的时候做loading开关设置const test = () => { this.setState({ loading: true; }); // 相关操作，数据请求或者等等 this.setState(...
2020-01-03 17:25:24
797
原创 react 父组件中的事件调用子组件方法
父组件调用子组件方法import React, { Component } from "react";import ReactDOM from "react-dom";import "./styles.css";class Child extends Component { state = { name: null }; componentDidMount() {...
2020-01-02 10:44:46
307
1
原创 阶段技术总结 (dva)
创建一个新的页面src/pages 文件夹下创建一个新的页面，目录结构如下：> Shipping > components > models index.jsx配置路由config/config.js中按照，pro 示例配置路由状态管理的整个过程这里指的是使用状态管理的整个思路，不是指代码的书写顺序，代码的书写过程应该是下面的倒序第一步： @connec...
2019-12-30 16:08:18
304
原创 Number.prototype.toFixed()
.toFixed()let a = 0.33333console.log(typeof a.toFixed(2)) // stringconsole.log(typeof 0.33333.toFixed(2)) // string注意：经过.toFixed()处理后会改变number数据类型为stringlet b = -0.33333console.log(typeof...
2019-12-19 13:59:59
366
原创 调用 api 接口 | mock 本地数据 | dva
dva 官网快速入门，搭建环境…第一步：编辑.webpackrc文件添加："proxy": { "/apis": { "target": "目标 API 接口", "changeOrigin": true, "pathRewrite": {"^/apis": ""} }}配置代理，调通接口第二步：编辑services/example.js文件impo...
2019-12-11 15:17:35
570
原创 number | string | array 转换
numbernumber => string => arrlet a = 123a.toString() // "123"let str = a.toString().split() // ["123"]let arr = a.toString().split('') // ["1", "2", "3"]说明：.toString() (括号里面没有参...
2019-12-06 14:58:07
285
转载 Array.prototype.reduce() 的简单使用 (续...)
reduce()方法对数组中的每个元素执行一个自定义的reducer函数(升序执行)，将其结果汇总为单个返回值const array = [1, 2, 3, 4];const reducer = (accumulator, currentValue) => accumulator + currentValue;const a = array.reduce(reducer); //...
2019-12-05 10:46:58
130
转载 ant design 项目实例
安装 Umi UI | 创建新应用参考官网第一步：新建路由创建路由：umi g page products目录src/pages中会添加products.js和products.css两个文件第二步：编写 UI Component在编辑器中打开，新建src/components/ProductList.js文件import { Table, Popconfirm, Butt...
2019-12-03 11:28:58
1096
原创 vsCode 上配置 git
简单三步走第一步：下载 git-bash选择默认下载地址，下面配置环境变量的时候可以直接复制https://git-scm.com/downloads第二步：配置环境变量添加系统环境变量：C:\Program Files\Git\bin\git.exe第三步：修改vsCode中设置settings.json 文件中添加："git.path": "C:/Program File...
2019-12-02 12:52:54
107
原创 Object.prototype.assign()
入手一个简单的例子const target = {a: 1, b: 2}const source = {b: 3, c: 4}const aa = Object.assign(target, source)console.log(aa)console.log(target)console.log(source)输出：[object Object] { a: 1, b:...
2019-11-29 15:23:46
216
原创 webpack-dev-server 热更新
第一步npm install webpack-dev-server第二步配置 webpack.config.js 文件const path = require('path')const webpack = require('webpack') // 引入 webpackmodule.exports = { entry: './src/index.js', out...
2019-11-14 09:22:09
269
原创 ico 图标的制作
1. 制作 ico 图标打开 open，编辑图片2. 引入 html把制作好的 ico 格式图片放到文件目录中<link rel="shortcut icon" href="ico文件url">
2019-11-11 13:58:23
298
原创 babel 的配置和使用
第一步安装 babel 核心包和命令行工具npm install @babel/core // babel 核心npm install @babel/cli // babel 命令行工具第二步安装 babel 的预置配置和语法插件npm install @babel/preset-env // Es6+ 语法npm install @babel/preset-react...
2019-11-11 13:54:46
290
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人