自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

假装是个web dog

好好学习,天天向上,不定期更新

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

原创 echarts 不规则自定义custom 系列(vue 组件)

1.定义容器<div ref="canvas"></div>2.代码 props: { seriesData: [Array, Object, String], // 主要显示的数据 ySplintLine: { type: Boolean, default: false }, // 是否显示...

2020-04-27 17:27:34 4206 10

原创 echart 渐变内置生成器echarts.graphic.LinearGradient

在使用echarts绘制图表时, 如果需要使用渐变色, 则应使用echarts内置的渐变色生成器echarts.graphic.LinearGradientitemStyle: { normal: { color: '#00E2FF', lineStyle: { // 系列级个性化折线样式 width: 5, type: 'solid', // 颜色渐变函数...

2019-07-22 17:37:49 33752 4

原创 uniapp 安卓在线升级 (后台提供接口 )

在线升级

2023-05-29 16:50:16 397

原创 常用js函数方法积累

常用js函数积累map() 方法reduce()filter() 函数find() 函数every() 函数some()函数includes() 函数

2023-03-20 15:59:08 342

原创 uni-app api 获取系统信息(高、宽)用法及封装

uni-app api 获取系统信息(高、宽)用法及封装

2023-03-10 11:50:45 1475

原创 uni-app: onBackPress() 监听页面返回 - 更新数据

uni-app: onBackPress() 监听页面返回 - 更新数据。

2023-03-09 11:45:54 10462 1

原创 关于uinapp 调用PDA设备激光扫码 - 广播模式

不是所有的PAD设备 都有设置-扫描设置-然后选择广播模式(查看广播动作-广播标签),可能也是在pad设备自带扫描工具(app)参数设置里面–然后选择广播模式(查看广播动作/名称-广播标签/键值/key)** 3.** 调用。

2023-02-22 09:44:33 2941 1

原创 关于axios详解及二次封装

Axios 详细解析,二次封装axios 代码以及注释

2023-02-17 21:30:00 148

原创 前端性能优化

前端性能优化归纳7小点

2022-10-13 10:42:03 580

原创 NPM - 常使用设置

npm 常用设置命令

2022-06-07 17:25:26 942

原创 Element Plus

官网地址:https://element-plus.gitee.io/#/zh-CN/component/changelog

2020-12-02 18:36:03 5774

原创 vue3.0学习记录和实战项目

vue3.0+TS+antd vue前言安装目前的了解(值得注意的新特性)this指向的变化2.x vs 3.0 钩子函数setuprefisRefreactiveisReactivetoRefswatch 响应式更改项目登录页面项目地址前言在掘金上摸鱼看到了“一个基于vue3+vite+ts的完整项目”的文章,好了我也要开始搞一搞vue3.0,反正最近打算搞个新项目,干脆就用新的;于是开始摸鱼看文章了,现在也很多关于3.0的文章看看,(学习中,不对的,欢迎纠正)文档:.官方(应该是吧)安装

2020-10-31 18:21:57 4807 4

原创 vite 搭建 Vue3.0项目

vite 搭建 Vue3.0项目vue3.0+TS+AntDesignVue项目vite初始化vite项目配置项目配置typescript配置Vue Router配置Vuex配置Ant Design Vuevue3.0+TS+AntDesignVue项目vitevite是尤大大在今年新鼓捣出来的一个工具为什么尤大大要推出vite,在使用webpack的时候,每次开发启动项目都比较慢,而且热更新也比较慢,而vite的主要特点就是快,官网对于vite的特点是这样描述的1、快速的冷启动2、即时的模块热

2020-10-16 18:42:41 6715

原创 Vue2.0+ ts(TypeScript)常用装饰器

装饰器 一、前言二、装饰器三、常用装饰器使用方式1、@Component 和 @Prop 装饰器2、@Emit 装饰器3、@Model 装饰器4、@Watch 装饰器5、@Provide 装饰器 和 @Inject 装饰器6、@PropSync一、前言在构建完项目之后,上一篇构建地址 ,打开src/components/HelloWorld.vue,将会发现写法已大有不同,如图看到上面代码引入了vue-property-decorator 它是依赖于 vue-class-componentIns

2020-09-24 17:53:37 3958 2

原创 nvm安装和使用

nvm安装和使用nvm安装安装/管理nodejs命令提示nvm安装推荐使用nvm-setup安装版,免配置.下载安装包傻瓜式安装就行;打开CMD,输入命令 nvm ,安装成功则如下显示。可以看到里面列出了各种命令安装/管理nodejs1、安装node命令(安装时,会自动安装npm) nvm install <version> // version是版本号 例如 : nvm install 14.11.02、切换node 版本 nvm use <vers

2020-09-16 19:10:09 344

原创 vue cli4 安装及构建(vue+ts)项目目录

vue cli4 安装及构建项目目录环境需求安装vue cli创建一个项目环境需求Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。你可以使用 nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本。本机电脑node 版本 14.11.0 (使用的是nvm 管理的node版本)安装vue cli可以使用下列任一命令安装这个新的包: npm install -g @vue/cli yarn global add @vue/cli查看安装版

2020-09-16 18:42:10 1112 1

原创 web前端跨域处理

跨域处理什么是跨域什么是同源策略如何解决跨域1. 通过jsonp2. cors(跨域资源共享)3. nginx代理跨域4. nodejs中间件代理跨域什么是跨域由于浏览器同源策略限制的一类请求场景,当在不同域名、端口、协议就会构成跨域。什么是同源策略所谓的同源是指“协议、域名、端口”三者都相同;它是浏览器最核心的也最基本的安全功能,如果没有同源策略,很容易遭受xss、csfr攻击。如何解决跨域目前常用的有以下4中:1. 通过jsonp最早的解决方案,利用script标签可以跨域的原理实现

2020-08-25 20:23:51 158

原创 vue知识点总结

1.vue是怎么实现数据的双向绑定的;采用数据劫持结合发布者-订阅者模式,通过object.defineproperty来劫持个属性的setter、getterl,来触发回到函数的2.Js 如何实现数据双向绑定?//Html<body><div id=”app”><input type=”text” id=”test”/><p id=”show”></p></div></body>//js<s

2020-08-20 16:16:47 197

原创 webpack4.+ 学习二(生产环境配置)

webpack 生产环境配置前言原因配置分离(开发/生产)环境文件1. 首先就要从安装 webpack-merge 开始,并将之前已成型的代码进行分离:2. 新建对应的文件夹,去掉 webpack.config.js3. 重新指向到新配置,更改package.json前言把 webpack4.+ 学习一(基本配置) 代码搞过来,建议重新安装一些依赖,防止报错。原因development(开发环境) 和 production(生产环境) 这两个环境下的构建目标存在着巨大差异。要遵循逻辑分离,因此通常

2020-07-08 15:13:51 385

原创 webpack4.+ 学习一(基本配置)

起步保证当期电脑已经安装node、npm (没有的话自行安装)先新建一个文件夹(名字随便,我这里是)webpack-demo,初始化npm, 先全局安装webpack(因为我用到了webpack命令),然后在本地安装webpack、webpack cli (当然你可以命令行工具或者是编辑器的终端)// 创建文件夹 (当然你也可以自行创建)mkdir webpack-demo // 进入当前文件夹cd webpack-demo// 初始化 ,加上-y 自动配置,当然你可以 npm in

2020-07-01 16:19:07 354

原创 vue编写嵌套树状结构导航组件

这里我就直接贴代码了,里面有一点点备注,哈哈哈<template> <div> <div v-for="item in dataList"> <div class="tree-row" :class="selectTreeItem==item.id?'active-row':''" @click="clickItem(item.id,item.queryData)" >

2020-06-12 20:01:53 422

原创 js深拷贝和浅拷贝以及实现深拷贝的方法

前言为啥写这个?因为项目中遇到了,就记录一下。如何区分深拷贝与浅拷贝简单来说就是:假设B复制了A,当修改A/B时,看A/B是否会发生变化,如果A/B也跟着变了,说明是浅拷贝,如果A/B没变,那是深拷贝。深拷贝与浅拷贝出现的根源就在于引用数据类型、内存地址。(这里需要了解一下堆栈、数据类型)深拷贝: 是在A/B计算机中分别开辟了一块内存地址 用于存放复制的对象。浅拷贝: 是一个引用传递而不是值传递,A和B指向的是同一个 内存地址 。如何把浅拷贝变为深拷贝1、最简单方式:先转换成字符串,然后在转.

2020-06-12 19:07:10 540

原创 代码规范

这是我觉得不错的,腾讯 AollyTeam 团队的代码规范网址:http://alloyteam.github.io/CodeGuide/

2020-06-02 08:44:32 187

原创 vue实现五子棋

思路1.vue实现五子棋空棋盘开局。 画网格:网格有 15 行 15 列,共有 225 个交叉点黑先、白后,交替下子,每次只能下一子胜负判定 按照简单的规则,从当前下子点位的方向判断()。如果有一个方向满足连续5个黑子或白子,游戏结束。2.支持dom和canvas切换判断浏览器是否支持canvas: false: 不支持 切换dom方式 true: 支持 使用canvas3.实现悔棋功能4.实现撤销悔棋例子:为了简便,我就把所有写在一起了,按理来说是要分文件

2020-05-27 17:53:08 1920

原创 css实现左右中布局的几种方式以及遇过的问题

1、display 弹性布局flex布局 父元素display:flex; 左右子元素设置宽度width: 10rem;中间子元素设置 flex:1 或者 width: calc(100% - 20rem)<style> *{ margin: 0; padding: 0; } .content{ display: flex; } .box1,.box2,.box3{ height: 6.25rem; display: inline-block; } .bo.

2020-05-20 17:48:00 659

原创 vue的自定义指令与实例

前言写这篇的原因来源于面试题,具体内容可参考官方文档简介vue 除了核心功能默认内置的指令(v-if,v-model,v-show…)之外,还可以自定义自己需要的指令进行复用,对普通 DOM 元素进行底层操作;你可以注册全局指令(Vue.directive( id, [definition] ))和局部指令(Vue实例中添加 directives 对象 数据注册局部自定义指令),这点和组件一样。钩子函数一个指令定义对象可以提供如下几个钩子函数 (均为可选):bind:只调用一次,指令第一次绑

2020-05-14 19:23:00 379

原创 typescript记录1

typescript执行安装问题一环境安装: npm install –g typescript查看版本号:$ tsc –v遇到的问题PS D:\tsc> tsc -vtsc : 无法加载文件 C:\Users\F1334187\AppData\Roaming\npm\tsc.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅 http://go.microsof...

2020-05-05 16:30:00 192

原创 vue双向绑定原理:Object.defineProperty

vue实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应监听回调。当你把一个普通的 JavaScript 对象传入 Vue 实例作为data选项,Vue 将遍历此对象所有的 property,并使用Object.definePropert...

2020-04-29 10:56:58 377

原创 vue 封装组件 (例子table组件)

封装组件的步骤  建立组件的模板,先把架子搭起来,写写样式,考虑好组件的基本逻辑。       准备好组件的数据输入。即分析好逻辑,定好 props 里面的数据、类型。(后面详解)   准备好组件的数据输出。即根据组件逻辑,做好要暴露出来的方法。(后面详解)   封装完毕了,直接调用即可。我写table组件的思路:1.样式定义内容间距(innerSpacing):big(16p...

2020-04-28 11:14:40 6611

原创 前端SEO

SEO:搜索引擎优化。是一种方式:利用搜索引擎的规则提高网站在有关搜索引擎内的自然排名工作原理:搜索引擎“蜘蛛”是通过,连接地址来找到你的网站的,seo就是让你的网站符合“蜘蛛” 的 ‘胃口’,让你的网站连接地址刚好的呈现在搜索引擎面前,从而让“蜘蛛”抓取你网站的连接地址。前端优化内容:通过网站的结构布局设计和网页代码优化,使前端页面既能让浏览器用户能够看懂,也能让“蜘蛛”看...

2020-04-27 16:36:34 351

原创 JavaScript 数组去重和其他操作方法集合

es6 使用 Set 和 Map 数据结构去重利用Set方法可以去重,用Array.from返回数组var array = [1,2,1,1,’1’] function unique(array){ return Array.from(new Set(array))}console.log(unique(array)) //[1,2,’1...

2020-04-14 15:44:39 187

原创 css 问题汇总

如何解决html设置height:100%无效的问题?解决方法:html,body {height:100%; } div {height:100%;position: absolute; } 前提是,父元素要设置宽高,并且使用position定位:relative/absolute....css的height:100%和height:inherit有什么区别? ...

2020-04-14 14:16:05 104

原创 javascript 递归

/* departTree 里面添加 isCollaps */ getDataModel(data) { function readEveryData(val) { val.forEach((e, i) => { val[i].isCollaps = false if (val[i].childList !== u...

2020-04-13 20:28:25 72

原创 前端性能之减少重排和重绘

怎么减少重排和重绘??首先减少获取操作1 在for循环中,尽量不要进行样式的获取操作(因为一获取就会flush(清空)浏览器维护的队列 )2 尽量少用sytle修改样式,通过添加class进行一次性修改样式3 使用 translate 代替 left/top等,(translate只会触发重绘,不会引起重排,可以减少一次重排的时间)4 使用opacity代替visibi...

2020-04-13 20:25:56 571

原创 git 总结命令

简易的命令:上传代码git add .git commit -m "备注"git push拉取git pull冲突:当执行了git pull 自动进入vim编辑器解决冲突,按i进入编辑模式:wq保存退出遠程克隆拉取git clone https://gitee.com/xx_xx_xx/xxxxxx.git (后面的是地址)查看遠程分支git branch -r...

2020-04-13 20:20:38 142

原创 Javascript 原型以及原型链

.原型每个函数对象都会有个prototype属性,它指向了该构建函数实例化的原型。使用该构建函数实例化对象时,会继承该原型中的属性及方法。所有的对象都有__proto__属性,它指向了创建它的构建函数的原型。prototype是一个类的属性,所有类对象在实例化的时候将会拥有prototype中的属性和方法, 一个对象的__proto__属性,指向这个对象所在的类的prototype属性...

2020-04-13 20:14:03 140

原创 vue单文件组件编写应用

这个弹窗实例是基于element ui 写的(根据自己情况写就好)1.首先根据自己的需求把需要的组件样式想好或者编辑好2.然后看有哪些需要传的参数,改成动态的<template> <el-row :style="style" class="formate-border"> <span class="detail-part-title">...

2019-08-08 10:35:36 196

原创 echart 自适应宽度两种方法

1.一个页面多个图表的自适应宽度可以用注意:应写在多个图表的后面,不能一个一个写,会发生错误//根据窗口的大小变动图表 window.onresize = function(){ myChart.resize(); myChart1.resize(); //若有多个图表变动,可多写}2.若是一个页面的多个图表需要分别监听改变宽度的话用(可以一个一个写)...

2019-08-06 11:20:08 12450

原创 HT for web 學習1

Api文档:https://www.hightopo.com/guide/doc/index.html1.HT for web 是什麼?ht是基于HTML5标准的企业应用图形界面一站式解决方案, 其包含通用组件、拓扑组件和3D渲染引擎等丰富的图形界面开发类库(并不開源),网上直接下载js包是没有用的,要授权!!!实例:1.拓扑图<!DOCTYPE html>&l...

2019-08-01 10:09:28 1138

原创 hbuilder 创建 vue cli项目npm run dev报错解决方式

用hbuilder 创建好项目,准备运行,但是报错原因据说是缺少依赖;所以需要初始化项目第一个方法是:1、vue init webpack -g (按步骤创建项目就行)第二个方法据说是 (我没试) npm run build npm run serve ...

2019-07-25 15:33:18 3125 1

空空如也

空空如也

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

TA关注的人

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