自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

原创 react hooks 使用过程中、汇总

工具方法导出excel下载 npm install xlsx// 定义方法/** * 导出excel * @param column 表头 * @param list 数据 * @param title 标题 */ exportExcel<V, T>(column: V, list: T[], title: string) { const json = list.map((item: T) => { return Ob

2020-07-29 17:42:59 19

原创 记录nuxt 使用 vue-seamless-scroll 无缝滚动和 v-viewer点击放大图片的组件

地址v-viewer 点击图片放大vue-seamless-scroll 无缝滚动遇到的问题v-viewer 点击图片无法响应事件解决: 使用事件委托 GotoImage()<client-only> <scroll-seamless :data="list" :class="ScrollClass" :class-option="options" // 事件委托 @cli

2020-07-24 11:51:16 15

原创 react next vw适配方案

安装依赖: yarn add postcss-aspect-ratio-mini postcss-preset-env postcss-cssnext postcss-flexbugs-fixes postcss-loader postcss-px-to-viewport postcss-viewport-units postcss-write-svg -D根目录创建 postcss.config.js/* * @Description: * @version: * @Author: 周凯 .

2020-07-17 10:40:44 20

原创 react next 构建大屏实践

搭建基础布局参考资料: 地址

2020-07-14 17:08:22 33

原创 git 提交代码规范总结

一、前言日常开发中,保持良好的代码规范有利于提高项目的质量。而指定并遵守 git commit 的使用规范,则有利于提高项目的管理效率。二、提交格式在git add后,需要执行git commit进行提交,如、约定中应添加对应的描述信息,即通过:git commit -m 进行提交提交格式如下:<type>(<scope>): <subject><BLANK LINE><body><BLANK LINE><foo

2020-07-10 15:56:33 18

原创 react-admin antd使用过程中遇到的问题

报错解决[Ant Design] Warning: Instance created by useForm is not connected to any Form element. Forget to pass form prop?问题 antd: 4.2.0, react: 16.13.1,Modal 中使用 Form ,使用 React Hooks const [form] = Form.useForm(); 创建实例时,会出现以下警告。原因: Modal 挂载的 HTML 节点默认为 d

2020-07-08 10:08:49 60

原创 前端脚手架制作

使用写一个属于你的前端脚手架工具

2020-07-03 17:46:33 10

原创 react 使用@loadable/component 实现路由动态懒加载

踩坑记录动态引入import()变量失效问题, import不能导入变量字符串的路径问题因为webpack的现在的实现方式不能实现完全动态,所以可以通过字符串模板来提供部分信息给webpack,如下/** * 根据已经获取的菜单组合需要生成的路由 * @param list 数据 * @param parentPath 父级的路径,组合子级可访问路径 */const combinationRouting = (list: Menus[], parentPath?: string) =&

2020-07-02 15:50:50 152

原创 egg typescript 使用遇到的问题汇总

sequelize类型Sequelize.STRING // VARCHAR(255)Sequelize.STRING(1234) // VARCHAR(1234)Sequelize.STRING.BINARY // VARCHAR BINARYSequelize.TEXT // TEXTSequelize.TEXT('tiny')

2020-06-30 22:50:18 31

原创 webstorm 个人设置总结

配置设置代码自动格式化

2020-06-30 19:14:28 76

原创 使用数据属性 data-* 属性允许我们在标准内于HTML元素中存储额外的信息

HTML 语法语法非常简单。所有在元素上以data-开头的属性为数据属性。比如说你有一篇文章,而你又想要存储一些不需要显示在浏览器上的额外信息。请使用data属性:<article id="electriccars" data-columns="3" data-index-number="12314" data-parent="cars">...</article>JavaScript 访问在外部使用JavaScript去访问这些属性的值同样非常

2020-06-28 16:03:34 26

原创 扁平数组和树形结构的相互转换

扁平数组转换为树形结构这个是最常用的,当我们从后台获取一个扁平数组的时候,通常比如用id、pid来标识父子关系,如:var arr = [{id: 1, pid: '-1'},{id: 11, pid: '1'},{id: 12, pid: '1'}]用map记录的方法是最常用效果也最好的复杂度是O(nlgn),支持多个根节点:function listToTree(list) { var map = {}, node, tree= [], i; for (i = 0; i

2020-06-28 09:46:21 48 1

原创 vscode个人配置详解集合

在Windows10 VSCode中安装使用Fira Code字体

2020-06-28 08:44:34 41

原创 nuxt 学习总结

错误总结使用cookie git地址 yarn add cookie-universal-nuxt{ modules: [ // Simple usage 'cookie-universal-nuxt', // With options ['cookie-universal-nuxt', { alias: 'cookiz' }], ]}文章nuxt 文章使用介绍点亮你的Vue技术栈,万字Nuxt.js实践笔记来了...

2020-06-24 15:52:07 54

原创 大屏制作总结

可适配不同分辨率的屏幕实现方式: 按照设计图规格尺寸制作,使用transform: scale(0.4, 0.4);缩放transform: scale(0.4, 0.4); width: 3840px; height: 2160px; background-image: url(/img/bg/bg18.jpg); background-position: 0% 0%; background-size: 100% 100%; background-r

2020-06-23 17:57:39 26

原创 Js获取屏幕宽度、高度

document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.bo

2020-06-23 10:28:01 31

原创 CSS 动画transition keyframes animation总结

CSS transitions在改变CSS属性的时候,transitions提供给了开发者一共方式去控制动画的速度。通常来讲,属性改变所产生的影响是立刻生效的,举个例子:.img { width: 200px;}.img:hover { width: 300px;}触发hover的时候,你将看到图片在瞬间被放大,这种突兀的变化会带来很差的用户体验。而使用CSS transitions就可以展现出变化过程中的过渡段。也就是说,transitions会将整个变化的过程展现出来,而不是简

2020-06-16 16:21:19 26

原创 node.js 调试、学习集合

调试参考地址

2020-06-14 13:14:53 21

原创 vue 常用工具大集合,自己总结

插件数字翻牌器 地址

2020-06-11 20:56:55 77

原创 Lodash节流与防抖总结

throttle API走起_.throttle(func, [wait=0], [options={}])func (Function): 要节流的函数。[wait=0] (number): 需要节流的毫秒数。[options={}] (Object): 选项对象。[options.leading=true] (boolean): 指定调用在节流开始前,默认true。[options.trailing=true] (boolean): 指定调用在节流结束后,默认true。throttle

2020-06-09 18:47:02 84

原创 数组排序汇总

1、桶排序(桶中出现的数组元素都做个标记1,然后将桶数组中有1标记的元素依次打印)//简单, 但是不用,浪费内存var arr2=[];for(var i=0;i<arr.length;i++){ var key=arr[i]; arr2[key]=1;}for(var j in arr2){ console.log(j);}2、冒泡排序(每一趟找出最大的)//性能一般var arr=[1,5,7,9,16,2,4];//冒泡排序,每一趟找出最大的,总共比

2020-06-09 16:01:33 26

原创 flutter 实现app升级

准备工作集成flutter_bugly集成permission_handler获取权限集成path_provider 获取外部存储路径集成open_file打开文件遇到问题flutter_bugly这个方法FlutterBugly.checkUpgrade(isManual:true,isSilence:true),UpgradeInfo 一直返回null。下面是打印出来的logD/CrashReport(31776): [Upload] Bugly version from head

2020-06-07 20:45:41 144

原创 viser-vue 使用自定义主题配置

查看官方文档没有看到,好不容易找到????自定义主题官网配置地址解决方案:// theme为导出的主题数据var theme = { // 主题数据}// 注册主题const { Global } = window.G2Global.registerTheme('myTheme', theme)//注册完后,设置主题Global.setTheme('myTheme')issues: 地址...

2020-06-04 16:49:49 142

原创 postcss-plugin-px2rem vue-cli3使用记录

安装使用postcss-plugin-px2rem 地址设计稿 rootValue设置 rootValue = $designWidth*20/320;$designWidth 为设计稿宽度 参考地址

2020-06-02 16:15:02 66

原创 nuxt window is not defined

报错如下 nuxt window is not defined解决方案1: 在nuxt.config.js 里面添加ssr:falseplugins: [ '@/plugins/antd-ui', { src: '@/plugins/vue-map', ssr: false }, { src: '@/plugins/seamless-scroll', ssr: false } ],解决方案2: nuxt .

2020-06-01 10:33:28 64

原创 记一次vue中获取audio媒体总时长duration遇到的问题

audio获取当前播放时间在dom挂载完毕后访问currentTime属性获得,通过timeupdate钩子可实时监控audio 获取媒体总时长在canplay(浏览器可以开始播放该音视频)钩子函数回调中访问duration属性可获得(注:在dom挂载完直接获取duration会返回NaN)<audio @canplay="getDuration" @timeupdate="updateTime" ref="audio" :src="musicUrl"></audio>m

2020-05-28 15:36:31 240

原创 canvas 画半圆

画半圆 地址

2020-05-27 10:06:56 59

原创 react-hooks 常见错误汇总

常见错误Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?在使用react封装了一个公用组件时,组件中使用了connect连接redux后的组件,然后其他地方引用该组件后就提示以上警告,虽然不影响使用,但看着不舒服。解决方法:导出组件时使用:export default connect(

2020-05-26 16:25:33 42

原创 three.js个人总结学习

工具verge3D 图形化制作3D工具 地址

2020-05-24 20:14:49 27

原创 flutter学习集合

文章集合flutter学习实战详解: 地址flutter 各种实例demo例子 地址

2020-05-24 16:37:05 39

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