自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

虚怀若愚

桃李不言,下自成蹊

  • 博客(43)
  • 收藏
  • 关注

原创 使用Antd和Express实现文件的上传功能

文章目录前言使用Nodejs的Express框架实现文件上传后端功能使用Postman测试文件上传功能使用Antd的Upload组件实现文件上传前端功能前言根据公司需求,前端网页上传excel文件,后端接收文件并解析。采用Antd的Upload组件实现前端功能,由于上传文件不好用mock进行测试,临时编写一个node程序测试后端功能。使用Nodejs的Express框架实现文件上传后端功能使用Express框架,关键是使用multer包来实现文件上传功能 "dependencies": {

2021-09-14 10:41:29 1053

原创 Dart学习笔记(B站)

B站自学视频地址:Dart Flutter教程_Dart Flutter2入门变量、常量以及命名规则(chapter02)dart是一个强大的脚本语言,可以不预先定义变量类型,会自动类型推断 var str = '你好dart'; print(str is String); // true var myNum = 1234; print(myNum is int); // truedart变量命名区分大小写,Age和age是2个不同的变量const和finalconst值

2021-06-24 11:30:41 700

原创 阿里云使用Ngrok内网穿透

使用自定义域名:自己的域名,阿里云/腾讯云前置域名:自定义域名:wx.yihaobo.net,域名服务器上修改,输入该域名跳转Nginxnginx -t查看本地目录https:修改sunny配置修改本地nginx配置和腾讯云配置下载ssl证书...

2021-03-25 10:07:13 864

原创 慕课网《Flutter从入门到进阶》学习笔记二

文章目录Flutter必备Dart基础:Dart快速入门学习资料Flutter必备Dart基础:Dart快速入门学习资料Dart中文网

2021-03-11 19:25:40 285

原创 Promise和async/await用法总结

文章目录Promise知识点汇总Promise链式写法catch和then捕获Promise异常主动跳出Promise链式Promise.allasync/awaitasyncawait错误用法await正确用法使用async/await 避免Promise链式写法async/await的中断实战中异步需要注意的地方Promise获取数据(串行)之then写法注意Promise循环获取数据(串行)之for循环async/await循环获取数据(串行)之for循环鸣谢Promise知识点汇总Promise

2021-02-06 00:09:22 673

原创 慕课网《Flutter从入门到进阶》学习笔记一

文章目录第1章 学习指南1-1 课程介绍与学习指南1-2 项目需求分析、技术分解第2章 Flutter学习经验2-1 Android开发者如何快速上手Flutter开发2-2 iOS开发者如何快速上手Flutter开发2-3 React Native开发者如何快速上手Flutter开发2-4 前端开发者如何快速上手Flutter开发相关文档第三章 Flutter入门:开发工具准备与开发环境搭建导言3-2 开发工具选择3-3 Flutter开发环境与iOS开发环境设置(Mac)几个命令3-4 Android开

2021-01-25 20:57:11 434

原创 使用Promise避免回调地狱

文章目录提出问题Promise简介Promise基本用法解决问题提出问题在前端开发过程中,经常碰到以下情况:调用A方法获取B方法的参数a,调用B方法获取C方法的参数b,最终调用C服方法获取要在Web页面显示的真实数据,如下: // 回调地狱 componentDidMount() { getStudentInfo('zhangyun').then(studentInfo => { console.log(studentInfo);

2021-01-19 17:17:44 517

原创 微信小程序axios封装和mock调试

文章目录前言axios封装mock调试效果:前言刚开始学习微信小程序,微信小程序通过自带的wx.request发送https请求(文档地址),写法感觉类似之前的jQuery,当嵌套多了以后看起来很不直观。由于之前对React + Ant Design Pro框架比较熟悉,所以才用promise函数对小程序的wx.request进行了封装,结合antd的mock进行调试。axios封装在微信小程序中新建如下文件:utils/request.js:使用promise封装微信小程序的wx.requ

2021-01-03 10:25:25 1182

原创 React Hooks学习笔记(一) -简介

React Hooks简介在React 16.8中引入了React Hooks概念,之前state只能在类组件中定义,有了Hooks后,可以在函数组件中使用state以及其它React特性。Hooks 使你在非 class 的情况下可以使用更多的 React 特性。 从概念上讲,React 组件一直更像是函数。而 Hooks 则拥抱了函数,同时也没有牺牲 React 的精神原则。Hooks 是一些可以让你在函数组件里“钩入” React State 及生命周期等特性的函数。Hooks 不能在 clas

2020-11-26 09:22:04 154

原创 React Context用法整理(附完整代码)

文章目录前言知识点汇总场景1:使用`Provider`和`Consumer`生产和消费数据文件目录及说明代码文件效果场景2:使用`ContextType`接收数据文件目录及说明代码文件效果场景3:动态和静态Context代码文件效果场景4:在嵌套组件中更新Context代码文件效果场景5:消费多个Context代码文件效果前言g yue h传统的React应用中,数据通过props属性自上而下(由父组件向子组件)传递,当组件层级数量增多时,在每一层传递props则很繁琐,Context提供了一种新的组件

2020-11-18 16:53:14 10466 2

原创 Spring结合Hibernate生成多对一和一对多数据表

前序类似的问题在工作中反复碰到,在此做个笔记一劳永逸。希望实现2张数据表,一张为标签表TB_LOCATIONTAG,一张为岗位表TB_LABELPOST,其中岗位表的id是标签表的LABELPOST_ID字段,即1个岗位可以有多个标签,岗位表和标签表是one-to-many的结构,标签和岗位就是many-to-one。类似的表结构很多,比如员工和岗位关系,教师和学生关系等表结构标签表TB_LOCATIONTAGIDNAMECOMMENTSINDEXNUMBERLABELPOST

2020-09-29 16:56:57 175

原创 InfluxDB和redis数据备份和导入

文章目录前言InfluxDB数据导出和导入导出历史数据导入历史数据常用查询命令redis数据导出和导入导出和导入redis查询前言公司项目采用redis作为实时库,InfluxDB作为历史库,需要从现场导出真实数据并导入公司搭建的环境进行模拟测试,在这里做个记录。InfluxDB数据导出和导入导出历史数据新建个文件夹,并执行命令:influxd backup -portable -database prs3000 -start 2020-07-01T16:00:00Z -end 2020-07

2020-09-09 10:28:37 2390

原创 记录一次前端面试,凭记忆整理了下试题

参加了一次前端面试,凭记忆记录下问题前端1: React Hooks全套随机问2: React中类组件和函数式组件的区别3:React中父子组件和跨组件通信方式(提示用React Hooks Context方法)4:使用immutable.js优势(详细看immutable实现)5:localstorage什么时候可以清空,如果需要每天清空一次localstorage需要怎么做6:Promise.all方法,如果参数里面一个Promise在Pending返回什么(需要详细理解Promise原理

2020-09-09 09:22:03 148

原创 Flutter开发环境在Mac上的搭建(iOS和Android图文详细过程)

文章目录地址2-2 快速上手Flutter开发3 MAC搭建IOS开发环境设置Flutter镜像获取Flutter SDK运行flutter doctor检查开发环境iOS开发环境设置地址视频地址flutter包的库:https://pub.dev2-2 快速上手Flutter开发开发工具:Android StudioFlutter采用的是声明式UIIOS控件和Flutter控件3 MAC搭建IOS开发环境设置Flutter镜像(非必须)获取Flutter SDKiOS开发环境设置

2020-09-04 09:03:31 1711

原创 React结合ECharts实现温度计组件

文章目录需求分析实现效果npm版本和参考demo实现步骤温度计湿度计需求分析项目需要在监控主页动态监视房间内的温度和湿度,业主希望使用不同的颜色来区分不同的温湿度范围,其中温度范围-20℃ ~ 50℃,湿度范围0RH% ~ 100RH%。实现效果最终效果如下图所示:其中温度范围渐变色从蓝色到红色,湿度范围渐变色从绿色到蓝色npm版本和参考demo项目采用Ant Design Pro V 2.0开发,所用的package版本如下:npm版本如下: "antd": "^3.26.18"

2020-08-10 14:24:54 1386 1

原创 Ant Design Pro路由参数改变页面没有重新渲染问题的解决

文章目录发现问题解决问题发现问题同一个组件根据Ant Pro路由传递进来的user和menu两个参数实现不同页面的渲染效果,测试发现页面在第一次渲染时没有问题,改变参数重新渲染则不刷新,如下所示:/users/admin/menus/chargingPile 渲染充电桩页面成功/users/admin/menus/airCondition 渲染空调页面失败最终发现应该使用React生命周...

2020-05-07 14:31:01 3540 1

原创 优化Ant Design走马灯(Carousel)组件,增加前后翻页按钮

文章目录原有组件不足实现效果实现思路实现过程原有组件不足原有的Carousel组件相关属性太少,翻页需要点击下面的dots来实现,由于dots很不明显,点击很困难(修改样式后还是很不容易点钟),根据项目需求,增加了前后按钮,鼠标移动上去显示翻页按钮,实现了前后手动翻页功能。实现效果见下图实现思路增加前后按钮,捆绑Carousel组件的next()和prev()方法,改变button的...

2020-05-06 14:20:13 7092 5

原创 react生命周期函数componentWillReceiveProps(通过比较先后传递的props刷新组件)

componentWillReceiveProps这个生命周期函数用的不多,碰到正好总结下。该函数通过比较先后两次传入的props数值是否相同,执行相应的方法。如代码所示,比较前一次传入的type, historyData和现在的是否相同,决定是否如何填充echarts options componentWillReceiveProps(nextProps) { const { t...

2020-05-06 14:05:00 1772

原创 react中定时刷新echarts图表

文章目录实现效果关键问题实现过程相关思考实现效果Ant Design结合React定时获取数据并刷新echarts图表,实现效果如下:关键问题在componentWillMount中设置定时器定时获取数值,在componentWillUnmount中删除定时器使用echarts-for-react构建echarts图表,数据刷新时填充新的数值到echarts option中,随后获取...

2020-05-06 13:58:57 1651

原创 Ant Design离线引入Symbol实现Icon

文章目录实现功能过程搜索图标加入项目封装组件具体使用效果其它细节实现功能Ant Design项目中自带的<Icon />不能满足要求,其一图表数量太少,其二样式单一,通过引入www.iconfont.cn中提供的图标实现既定功能。icon的引入有unicode、font-class、symbol三种,其中symbol代表了未来的主流,也是官网推荐用法。我们知道svg引入后可以自定...

2020-05-06 11:47:02 517

原创 近期前端总结

文章目录antd Tree中的checkbox实现单选js递归实现js获取当前年份和前一年字符串antd Tree中的checkbox实现单选只需要获取checkedKeys数组,只保留最后一位 /** * Tree单选功能实现 * @param checkedKeys */ handleCheck = checkedKeys => { checkedK...

2020-04-23 16:36:57 95

原创 Ant Design父组件一次性获取子组件表单值

文章目录业务需求实现思路业务需求父组件获取子组件数值,子组件是一个表单,包含Cascader、Select两种类型组件,其中能源类型Select根据Cascader数值拿到,效果如图:其中antd版本3.26.3实现思路通过使用 onFieldsChange获取表单值,通过回调函数传给父组件。antd官方说明父组件 // changedFields是子组件表单变化值,allFi...

2020-04-23 16:23:11 1371

原创 react中axios结合后端实现GET和POST请求

文章目录get实现方式1(参数直接在url中)get时间方式2(作为JSONString跟在url末尾)post实现(传递JSONObject)区别在这里不做介绍了,POST方法比GET方法稍微安全一点,GET方法比POST方法要快一些,个人感觉传递单个参数用GET,传递多个参数用POST。get实现方式1(参数直接在url中)前端export function getAllSubstat...

2020-03-23 13:56:11 4529

原创 ant design pro中DatePicker更改月份显示为数字、增加YearPicker组件

文章目录问题描述修改MonthPicker增加YearPicker层级关系爷组件ReportDisplay父级组件ReportSearchBar底层组件YearPicker总结问题描述ant design pro中的DatePicker组件很好用,在项目中使用后有2个小瑕疵DatePicker、WeekPicker中显示的都是数字,但是月份显示是中文没有YearPicker组件,选择年...

2020-02-25 17:42:10 2258

原创 ant design pro覆盖样式

文章目录工作中碰到需要覆盖antd样式的过程,记录一下过程整个project采用antd的dark-theme主题,加入DatePicker和Cascade组建后底色不一样,看的很蛋疼,原始效果如下:强迫癌发作,准备把DatePicker组件底色改成和Cascade一样,右键chrome查看元素发现是默认的ant-input class选择器,那么就好办了,修改less如下,注意用gl...

2020-02-25 17:04:50 1907

原创 ES6返回JSX的两种方式

文章目录方式1:直接返回(注意圆括号内包含JSX表达式)方式2:返回一个数组工作中遇到根据条件判断返回JSX的情况,做个小结方式1:直接返回(注意圆括号内包含JSX表达式)return ( <MonthPicker className={styles.element} format='YYYY-MM' placeholder='请选择月份' onC...

2020-02-25 14:33:16 992

原创 React新生命周期函数getDerivedStateFromProps结合定时器更新组件数据

文章目录新生命周期函数getDerivedStateFromProps实现目标相关代码父组件子组件总结新生命周期函数getDerivedStateFromPropsreact 16.3后更新了生命周期函数,不建议使用原来的componentWillReceiveProps、componentWillUpdate、componentWillMount,增加了getDerivedStateFro...

2020-02-15 23:51:35 1247

原创 记录一次antd访问mock数据失败的原因

文章目录组件中配置service路径mock配置问题总结组件中配置 const params = { value: '0052akr0jgp3ij', label: '实验设备', }; getMeasurementValuesByDevice(params).then(response => { this.setState({ ...

2020-02-15 19:00:16 1209

原创 记录一次排查问题:Hibernate删除数据表报InvalidDataAccessApiUsageException

文章目录现象分析hibenate映射配置检查Spring AOP配置检查hibernate表结构检查感谢现象通过service层调用dao层方法,通过hibernate删除用户管理表TB_SYSACCOUNT条目的时候报错:org.springframework.dao.InvalidDataAccessApiUsageException: Write operations are not...

2020-02-11 16:01:37 288

原创 Oracle数据表被锁死后解锁

查看哪个session引起的锁死select b.username,b.sid,b.serial#,logon_time from v$locked_object a,v$session b where a.session_id = b.sid order by b.logon_time;杀掉对应的进行-- alter system kill session'sid,serial#'al...

2020-02-09 12:28:36 126

原创 antd父组件获取子组件表单的值

文章目录实现功能组件关系基本思路父组件中关键代码子组件中关键代码完整代码父组件AccountManage.js子组件AccountRoleSearchBar.js子组件UserMainForm.js实现功能编写用户管理模块前端界面,实现用户的增加、查询、删除、更新操作,为了体现React模块的复用性,拆分为1个父组件和2个子组件,整体效果如下:整体页面:新增和编辑用户弹出窗UserMai...

2020-02-08 19:47:03 2289

原创 js中undefined和null判断

判断是否为undefinedvar exp = undefined;if (typeof(exp) == undefined){ alert("undefined");}判断是否为nullvar exp = null; if (!exp && typeof(exp)!=”undefined” && exp!=0) { alert(“is ...

2020-01-16 15:25:34 201

原创 Ant Design Pro引入svg文件(非icon)

文章目录前言路由和菜单配置代理配置页面和组件配置启动http服务最终效果前言传统的基于C/S架构的自动化监控系统随着web技术的发展也日新月异,目前比较常见的做法是监控页面图作为svg嵌入web浏览器,通过浏览器监控刀闸状态和开关位置,本文提供一种实现方法。版本如下:Ant Design Pro: 脚手架2.0Python:2.7.16路由和菜单配置路由和菜单配置: //...

2019-12-25 16:50:51 3023

原创 Ant Design Pro引入自定义主题及在主题文件中配置背景图片

文章目录前言分析修改和引入主题文件在主题文件中配置背景图片前言开发环境:Ant Design Pro: 2.0官方文档:定制主题Ant Design Pro官方提供了黑色主题和阿里云控制台主题,可以参考文档直接使用。项目需求:前端主题根据应用场景灵活匹配,在一个主题文件里能修改所有属性。背景图片可以在主题文件中定制。分析2.0版本的Ant Design Pro默认主题路...

2019-12-16 15:26:13 9904

原创 Ant Design Pro V2动态菜单实现

文章目录前言实现效果前端实现过程官网文档BasicLayout组件中调用model/menu.jsmodel/menu.js中引入serviceservice中定义后端API后端实现过程定义菜单类定义控制器效果验证前言Ant Design Pro是蚂蚁金服团队出品的一款前端框架,安装完毕后可以看到菜单和路由是静态渲染的,在实际的开发过程中,经常需要根据用户名或者权限生成不同的菜单,下面介绍一下...

2019-12-11 16:27:24 875

原创 基于Spring和Ant Design Pro在localStorage中存储数据

文章目录背景介绍实现功能后端实现(Spring)前端实现(Ant Design Pro)背景介绍在Web开发过程中,往往需要获取一些数据,比如用户登录后的用户名。以往前后端不分离的开发过程中,可以把这些数据放在session中获取,在HTML5中引入了LocalStorage,可以把数据存储在LocalStorage中。Ant Design Pro是一款基于DVA的前端框架,当每个Web页面...

2019-12-10 16:57:35 2416

原创 Ant Design中的dva流程梳理

文章目录功能代码功能实现<ul>增加<li>功能代码page层:src/routes/List.jsimport React from 'react';//dva是1种分层想,将page(routes/List.js)和model(models/ListData.js)进行分层//其中page只负责页面显示,数据在model中进行处理import {co...

2019-11-29 17:24:20 1150

原创 React组件渲染后对DOM的操作示例

文章目录在React.js中基本不需要对DOM进行操作,可以直接通过 setState 的方式重新渲染组件,渲染的时候可以把新的 props 传递给子组件,从而达到页面数据更新的效果。但是有的时候需要组件渲染完后对DOM进行一些操作,比如表单提交后对其中的&lt;input&gt;中的内容进行清空,重新定义鼠标焦点,下面以1个简单的例子进行说明。先看下显示效果:在上例中,组件渲染结束后,清...

2019-03-14 10:52:03 7330

原创 React绑定事件处理函数的3种方式

文章目录React绑定事件处理函数的3种方式constructor中绑定使用类的成员字段定义语法(比较常用)通过一个箭头函数将真实的事件处理函数包装一下(最简练)React绑定事件处理函数的3种方式看react官网提到绑定事件处理函数,研究了下有3种方式,做个总结如下:constructor中绑定在 constructor 中预先将所有的事件处理函数通过 bind 方法进行绑定,注意:Re...

2019-03-11 15:49:16 1887

原创 CentOS 7.4基于Hadoop 2.8.0安装Hive 2.3.4

开发环境系统: CentOS 7.4主机名: prs3000ip: 10.3.36.246hadoop 2.8.0hadoop安装参考上一篇 https://blog.csdn.net/qq_34307801/article/details/88235487hive下载下载地址:http://hive.apache.org/downloads.html点击选择2.3.4版本下载...

2019-03-08 11:13:52 240

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除