- 博客(238)
- 资源 (1)
- 收藏
- 关注
原创 基于Express+xterm.js的WebSSH
源文档地址:基于Express的WebSSH后端基于基于node,express,ssh2,websocket前端基于react,xterm.js1. 服务端1.1 下载npm包yarn add express-ws ssh2 utf81.2 服务端代码src/utils/createNewServer.tsconst SSHClient = require('ssh2').Client;const utf8 = require('utf8');export const creat
2020-12-22 15:19:10 829 1
原创 qiankun微前端初探
长期维护文档:qiankun微前端实践一:脚手架均为umijs参考官方文档:@umijs/plugin-qiankunant design pro 如何使用 qiankun 做微前端(上说明下述应用脚手架均为umijs子应用1. 下载qiankun插件yarn add -D @umijs/plugin-qiankun2. 配置// config/config.tsexport default { // ...... 其他配置 qiankun: {
2020-11-04 15:38:58 559
原创 前端docker化初探
前端Docker化初探(Windows)参考项目express-study维护文档Windows下载Docker Desktop验证docker --version docker --helpDocker命令参考Docker命令参考DockerfileFROM node:12.2-alpineCOPY package*.json ./RUN npm installCOPY . .EXPOSE 3736CMD npm run start-dev镜像dock
2020-10-10 13:21:32 970
原创 Vue3浅尝
Vue3浅尝中文版API文档地址:Vue3中文文档脚手架文档地址:Vue CLI本文基于vue-cli@4.5.0脚手架,vue@3.0.0-0,typescript实现。代码地址后续文档更新地址脚手架安装安装# 全局安装npm i -g @vue/cli# 创建项目vue create vue3-study# 使用typescriptvue add typescript配置vue.config.js// vue.config.jsconst path = require
2020-09-27 14:51:21 967
原创 React使用video.js播放RTMP流
video.js在6版本之后是和flash分开的,如果需要使用高版本的,需要额外安装videojs-flash准备项目有播放rtmp视频流的功能需求,所以搞来搞去还是想着用video.js这个库。基于react,video.js@5.18.4yarn add video.js@5.18.4 @types/video.js文档:video.js页面中使用页面中使用挺简单的import React, { useMemo, useState, useEffect } from 'react'.
2020-08-05 10:32:41 4878 1
原创 nginx前端配置
有时候为了提测或者更方便前端人员管理内网环境下的前端项目,前端需要自行配置nginx服务器,方便其他人员访问连接nginx服务器命令ssh username@192.168.2.94 或工具IIS7服务器管理找到路径上传 usr/local/nginx命令put path工具找到路径 /usr/loaca/nginx直接拖就行权限不足权限不足的原因是我们没有root权限,或者是操作文件夹权限,直接输入下面两个命令即可sudo susudo chmod -R 777 /us.
2020-08-02 08:32:27 2317 1
原创 发布自己的npm包(入门)
创建npm包新建文件夹 ly-utils 执行命令npm init完善package.jsonname:包的名字,不能与已发布包名字相同,不然发布失败main :包暴露方法的主文件repository :github仓库{ "name": "jx-public-utils", "version": "1.0.0", "description": "公共库方法", "main": "index.js", "scripts": { "test": "echo \"Er
2020-08-01 17:20:59 450
原创 react解析md文件
需求因为项目最后是对外开放的,所以在项目中有个文档中心,里面有一些用户手册、开发文档等展示需求。同时支持文章目录点击。分析第一时间想到的就是解析md文件了,语法简单,满足大部分写作要求,市面上也很有很多成熟的解析方案。依赖项这里是使用了react-markdown和github-markdown-css这两个库,一个是解析md文件,一个是github的md文档样式。具体解析md文件(大概)import React, { useState, useEffect } from 'react';
2020-07-29 17:29:44 4485 6
原创 TS函数组件中父组件调用子组件
需要用的apiforwardRef && useImperativeHandle父组件import React, { useRef } from 'react';import { Button } from 'antd';import Child from './Children';interface ReturnVoid { getValues: () => void}const ForwordRef: React.FC<any> = () =&
2020-07-26 11:21:10 2113 1
原创 Recharts(一)动态资源显示图
需求组件在找寻了echarts/antv等图标库之后发现没有自己想要的,后面经过问其他人找到了这个组件Recharts:API文档效果因为是写博客,所以我就额外做了一个简单版的,主要是思路,这是最终的效果图回归代码import React, { useState, useEffect } from 'react';import { AreaChart, Area, XAxis, YAxis, CartesianGrid,} from 'recharts';import { clon
2020-07-13 17:42:43 758
原创 axios取消上次重复请求
转载原文地址忘了,当时是随手搜的问题基于axiosutils/request.tslet pending: any[] = []; // 声明一个数组用于存储每个请求的取消函数和axios标识let cancelToken = axios.CancelToken;let removePending = (config: any) => { for (let p in pending) { // 当前请求在数组中存在时执行函数体 if (pending[p].u ===
2020-07-06 18:40:30 634
原创 antd4.0中Form使用initialValue
悲伤一开始一直以为initialValue是个好东西,这样我每次编辑的时候把数据传过来就行,后来发现不得行!给大家看看就离谱,后面认真看了一下文档才知道这个玩意是默认值,第一次有了之后就一直是这个。然后我在网上看用resetFields()这个方法,然而还是不得行,他每次点击显示的是上一次的数据,所以后面还是老老实实看了一下form的方法。解决放弃initialValueconst [form] = useForm()form.setFielsValue(currentItem)用for
2020-07-06 18:25:34 15436 5
原创 useModal(简单)
介绍因为一个项目中会有很多弹框,然后如果是同类型的弹框的话每次都要重新写一遍Modal。这样的话也不能说有事,就是会写很多重复代码并且在后期维护会感觉很难受,所以基于hooks我们也可以简单的做一个useModal。这里的话我是做了一个基于表单的useFormModal。封装hooks/useFormModalimport React, { useState } from 'react';import { Modal } from 'antd';interface modalState {
2020-06-30 18:08:45 6345
原创 umijs路由鉴权
Tips1、未登录鉴权后一律跳转至登录页面2、未声明路由跳转至404页面路由配置config/routers.tsexport const routes = [ { path: '/login', component: './Login' }, { path: '/', // 鉴权 有坑 鉴权下级一定要component wrappers: [ './Authorized', ], component: '../layouts',
2020-06-30 14:29:09 7706 4
原创 React高阶组件入门
typora-root-url: imagestypora-copy-images-to: imagesReact高阶组件入门React高阶组件也差不多快要退出主流舞台了,我是因为初学,所以记录一下自己的理解简介有点像Vue的Mixin(对象混入),封装公共模块。不过React并不提倡这种做法,所以引入了一种新的概念叫高阶组件(HOC):一个函数,能够接受一个组件并返回一个新的组件。命题一个模块需要显示用户个人基础信息,一个模块需要显示用户个人基础信息加等级一般做法ShowPers.
2020-06-29 15:01:47 858
原创 react动态导航
因为我是初学,所以关于react的文章会比较浅显,见谅因为我是用的antd配合学习的,然后再导航这块发现他们是写在一起的,然后我是从vue那边过来的,所以就感觉很别扭。同时也查阅了官方文档怎么配合列表组合。render() { const subItems = [{ key: 'sub1', name: 'Navigation O', type: 'mail...
2019-12-04 15:43:26 440
原创 input只读模式下IE表现
问题1:input输入框如果设置readonly点击输入框照样有光标解决:加上unselectable='on'<input type="text" name="transtype" unselectable='on' class="transtype" readonly>问题2:修改只读输入框的样式input:read-only{}不生效解决:用input[readonly...
2019-11-01 15:17:35 525
原创 IE下GET请求,url和参数相同的话,将不会重复发起请求
发现问题在做兼容ie11兼容得时候发现修改了数据但是返回回来的数据还是上一次的,跟chrome表现差太多了。后面上网查找资料发现:IE浏览器下使用GET发送请求时,如果两次请求的地址和参数相同,在不刷新页面的情况下,浏览器会缓存第一次请求的内容,服务端更新后浏览器仍然显示第一次的内容。解决1、在接口后面加个时间戳例:$.get('/mgmt/getWan.do?t='+ new Date...
2019-10-21 10:43:32 684
原创 axios封装(附带token静默刷新)
/**axios封装 * 请求拦截、相应拦截、错误统一处理 */import axios from 'axios';import router from '@/router'import urls from './urls'const base = urls.base;const base = urls.base;// 创建axios实例var instance = axios....
2019-09-05 17:21:18 2758 1
原创 npm下载electron包速度过慢
一:cnpm下载缺点:下载的包是类似快捷方式,复制出去的话要重新npm install一遍二:使用淘宝镜像新建.npmrc文件,后面那个斜杠一定要加electron_mirror=https://npm.taobao.org/mirrors/electron/...
2019-08-27 09:40:47 1460
原创 vuex进阶使用
接上文:vue-cli简单使用vuex因为最近在对项目进行重构工作,所以就慢慢抽离了一些模块,最早做的就是重构了vuex模块,我发现我写的太垃圾了,我自己都看不下去了。所以在对vuex深入了解之后就动手把vuex模块无缝重构了,下面就是我在实验vuex的一些体会。抽离层级在上一篇文章中我们就发现我们的store文件就一个,这明显就不利于协助开发和维护,所以我们首先就是抽离store中各个模块...
2019-06-22 11:11:07 512
原创 @property装饰器
@property最大的好处就是在类中把一个方法变成属性调用,起到既能检查属性,还能用属性的方式来访问该属性的作用class类直接将属性暴露给外界是非常不建议的!!!普通方法class student(object): def __init__(self, name='', grade=0): self._name = name self._grade ...
2019-06-06 15:13:01 182
原创 python Craps赌博游戏
主要是记录一下自己在python方面的简单逻辑思路(感觉和js写起来就是不一样的感觉),也是把什么简单的小题目做了做,觉得这个好像还有点意思规则:玩家掷两个骰子,每个骰子点数为1-6,如果第一次点数和为7或11,则玩家胜;如果点数和为2、3或12,则玩家输庄家胜。若和为其他点数,则记录第一次的点数和,玩家继续掷骰子,直至点数和等于第一次掷出的点数和则玩家胜;若掷出的点数和为7则庄家胜。#引入随...
2019-06-03 16:04:56 1477 9
原创 python 打包exe文件
上一篇说了我自己做了一个定时截屏的工具,我想如果我可以打包成exe文件,那我就可以单独放在桌面运行,不用进入程序启动运行就可以完成截屏工作了。安装模块1、pyinstaller这里建议最好使用命令安装,手动下载安装有很多其他的模块不存在,我就一开始是手动安装,安装一次缺一个模块,然后补一个,然后又少一个,命令行安装就没这个问题了pip install pyinstaller2、pyQt...
2019-05-30 10:52:54 6860
原创 python定时截屏
# python3 author Crow Luimport timefrom PIL import ImageGrabimport osabsPath = os.path.abspath('.')path = [x for x in os.listdir('.') if os.path.isdir(x)]# print(path)if 'png' in path: pri...
2019-05-30 09:34:21 5461 1
原创 python使用flask开发web接口(简单)
因为前面已经成功连接了数据库并且查询到了数据库数据,所以我就想着能不能做一个简单的web接口,因为现在都是使用前后端分离开发模式。然后就参考廖雪峰老师的教程使用了falsk这个web框架开发import flaskfrom flask import request #获取参数import json #post请求传入json对象时,通过json获取参数# 数据库查询def conn...
2019-05-29 15:54:41 6981 2
原创 python连接数据库查询
写在前面这是我的第一篇python文章,至于为什么学python呢?源于我前端工作比较不饱和,所以我老大叫我多学点东西,然后他就叫我可以考虑学一下python。然后呢,我也是感觉没什么事就打着学一下的心态去学了一下,不知不觉就学了差不多4天吧。主要是把廖雪峰老师的课程过了一遍:Python教程。自己还要学习的东西比较多,这个过一遍的目的是为了能够尽快上手通过实战项目让自己得到提高。我的开发环境...
2019-05-29 14:56:31 3142 1
原创 js循环处理 async await
需求因为最近的项目上有一个显示历史记录的需求,然后因为其中的创建人等都需要通过接口去获取具体的数据,这就造成了我需要循环遍历历史记录并同时处理其中的字段显示问题。思路我在网上看到的一些对于循环处理async await的方法是这样的let list = [1,2,3,4,5,6]function fun(item){ //这里其实是调用接口,所以时间完全无法把握 return...
2019-05-27 17:54:02 4460
原创 element-ui——树形控件默认高亮选中
这篇博客是因为我按照文档提示使用控件方法不能正确默认选中才写的。我的数据是多变的,也就是可能会刷新两三次。方法就是下面这个,但是这个位置很有讲究:highlight-current="true"ref="treeBox"node-key="departmentId" this.$nextTick(() => { // treeBox 元素的ref value ...
2019-05-21 15:01:51 8648 3
原创 vue脚手架兼容IE
我是使用vue脚手架开发项目的,但是今天在别人电脑上发现打不开,然后就发现是使用了360浏览器,然后f12中报错:Promise未定义,我自己使用IE浏览器打开也发现报错:Vuex require babel-polyfill promise。然后由此发现应该是缺少ES6运行环境支持。解决1、下载npm instal babel-polyfill --save-dev2、引用main....
2019-05-21 09:54:39 933
原创 element-ui——默认事件添加额外参数
大家都知道element-ui很多事件他都有默认参数,这里我就用下拉框来简单的说一下<template> <el-select v-model="value5" multiple placeholder="请选择" @change="change"> <el-option v-for="item in options" :key=...
2019-05-15 14:59:19 6520
原创 axios下载excel(后台返回文件流)
因为公司安全系统策略问题,以后的博客基本会以代码为主,就很难详细的一个一个步骤讲解了(或者说是我碰到问题后思考解决问题的思路),因为太难还原步骤了。axios配合后台接口返回文件流下载excel(因为我项目是excel)文件,这里也可以使用post请求,我写get请求只是因为我项目是get请求//url:api地址//params:参数axios.get(url, params, {...
2019-05-07 17:41:42 8906 4
原创 vue-cli进阶使用vuex(配合axios)
首先这不是一篇很正经的博客,这个只是我在项目实际中使用vuex的一些做法,不过其实做的不是很彻底,因为我没有彻底分离action,getter……。前面其实也写了一下简单实用vuex的,不过我觉得原来的不适合运用在正经项目中,所以就把那篇作为一个入门基础文:vue-cli简单实用vuex这里还要配合一下:vue-cli封装axios,因为我引入的文件就是这里的配置src/store/ind...
2019-04-17 17:50:48 679
原创 vue-cli封装axios
为什么要封装axios我就不多说了,总而言之就是为了方便开发配置如果需要配置跨域代理的话,可以先看看我这篇文章:vue-cli配置跨域全局方法新建src/request/http.js/**axios封装 * 请求拦截、相应拦截、错误统一处理 */import axios from 'axios';import router from '@/router'// 环境的切换/...
2019-04-15 17:04:05 1020
原创 vue-cli中css引入图片打包路径问题
问题开发模式图片路径(存储文件夹)src |__assets |__img |__css |__js这是我在css中引入图片的写法,在开发模式中是ok的base.scss$icon_url :'../img/icon.png' ;.logo{ background:url('../img/login_logo.png');}打包后这里就发现这个路径在cs...
2019-04-12 17:52:20 6081
原创 bootstrap-table(七)拖拽排序
需求这个需求是今天下午老大艾特我发的一张图片因为我们产品后台有一个组织的模块,其中就因为客户多次提示能不能做排序功能,所以老大就直接截图让我能不能做成钉钉这个样子,然后因为我用到的表格是bootstrap-table,所以我就去网上找了一下,发现在bootstrap-tbale扩展上有一个拖拽的功能库。所以也是花了点时间做到了老大要的效果。效果调整排序前点击调整排序后然后就可以随...
2019-03-21 17:21:09 8590 3
原创 webpack使用art-template
下载npm i art-template-loader art-template -d配置module.exports = { module: { rules: [ { test: /\.art$/, loader: 'art-template-loader' ...
2019-03-07 09:50:41 1904 6
原创 vscode格式化ES6中import错乱
在setting.json中添加"beautify.config": { "brace_style": "collapse,preserve-inline"}
2019-03-07 09:26:10 1847
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人