自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(72)
  • 收藏
  • 关注

原创 vue音频播放器组件

因为原生audio 播放器太丑了 重新整理 百度综合完成了播放器,基于element ui 组件书写的 需要的自取<template> <div class="audio-player"> <!-- :src="require(`${list[index].url}`) closeIcon --> <audio controls ref="audio-player"></audio> <div clas.

2022-02-14 22:29:35 7741 3

原创 vue-quill-editor的使用以及自定义tabar菜单

上一篇因为contenteditable IE的insertText 有兼容问题 ,所以重新用vue-quill-editor插件

2022-02-13 21:48:15 1193

原创 contenteditable富文本编辑器支持emoji插入表情

首先看下实现效果主要功能是插入表情emoji 点击顶部员工名称 可以插入员工名称到tetxarea中 ,点击face小图标可以展开表情选择注 IE有兼容性问题 不支持IE 主要是ie不持支insertText兼容问题字数限制我没有做完 方法已经提供实现<template> <div class="test"> <!-- caidan --> <div class="rich-text-area"> <

2022-02-13 14:04:29 2317 3

原创 实际开发中遇到的IIE浏览器兼容性问题

实际开发中遇到的IE浏览器兼容性问题样式问题开发中发现样式与chrome不一致 F12 检查 查看样式出入 检查webkit 前缀样式没有生效开发中一直报错 找了很久 才发现是运用表格时 属性重复书写问题 导致页面打不开–这个问题查了一天3.导出功能 下载Excel时 常用方法IE异常 处理 - baidu 可以找到解决方法4 调用接口时 get请求方式 请求数据后再次请求 数据一直是上次请求到的结果,找了很久才再无意中发现接口请求处显示来自缓存 。 解决: 再请求的地址后加时间

2022-01-21 20:44:34 631

原创 仿elementui Cascader级联器组件编写

因公司开发需要自己类似element UI 级联器类似得组件 刚好没有封装过 只能自己动手啦

2021-10-15 20:54:47 709

转载 关于循环里怎么正确使用await进行异步操作 资料

关于循环里怎么正确使用await进行异步操作 资料 如何在 JS 循环中正确使用 async 与 await 背景 在日常的项目开发中,常常遇到批量删除的应用场景,比如批量删除人员信息、设备信息、时间计划等。但是协议常常只给了单个删除的接口,而且设备那边同时只能处理一个相同的接口,所以使用异步+循环处理势在必行。本文就在...

2021-09-14 09:31:02 995

转载 项目中的.env.development和.env.production文件是啥

项目中的.env.development和.env.production文件是啥vue项目使用.env文件配置全局环境变量关于文件名:必须以如下方式命名,不要乱起名,也无需专门手动控制加载哪个文件.env 全局默认配置文件,不论什么环境都会加载合并.env.development 开发环境下的配置文件.env.production 生产环境下的配置文件========================================================================

2021-09-06 20:02:13 1389

转载 ES模块化的导入和导出

ES模块化的导入和导出 本文章向大家介绍ES模块化的导入和导出,主要包括ES模块化的导入和导出使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。 目录环境准备模块化export、importexportimportimport * asexport defaultimport 和 require 的区别参考环境准备三个...

2021-06-22 22:39:26 946

原创 如何实现一个拖拽

如何实现一个拖拽 // 拖拽功能 <div class="box" style="width: 100px;height: 100px;background: red;position: absolute;"> </div> let box = document.querySelector('.box'); let boxX = null; let boxY = null; let startX = null; let

2021-06-21 13:54:42 649

原创 清除浮动的最常用的四种方法

为什么要清除浮动?清除浮动主要是为了解决,父元素因为子级元素浮动引起的内部高度为0的问题

2021-06-19 15:53:47 224

转载 link与@import引入css文件区别

页面导入外部css文件的方法通常有两种,一种在网页中直接link标签加入,另一种在页面中@import引入css文件。两种引入形式如下:引入形式:两者差别:1 适用范围不同@import可以在网页页面中使用,也可以在css文件中使用,用来将多个css文件引入到一个css文件中;而link只能将css文件引入到网页页面中。2 功能范围不同link属于XHTML标签,而@import是CSS提供的一种方式,link标签除了可以加载CSS外,还可以定义rel连接属性,定义RSS等,@import就只

2021-06-19 15:01:47 897 1

原创 微信小程序基础学习四(echart的使用)

微信小程序基础学习四(echart的使用)先看下最终实现的效果–自己做的小demo首先到ECharts官网下载官网地址根据上面的网址下载代码把ec-canvas文件拷贝下来放到你自己的项目中,我放的是tool文件夹下面,你们随意引入的时候注意路径就行2.使用然后在你需要用的页面引入,在json中加入,这里要注意路径echart.json"usingComponents": { "tab":"../../component/tabs/tab", "ec-canvas":"..

2021-05-29 23:12:41 420 9

原创 微信小程序基础学习三

微信小程序基础学习三微信小程序云开发见大佬博文云开发小案例 支出收入tab切换使用组件使用时要在主页面json引入{ "usingComponents": { "tab":"../../component/tabs/tab", "iconList":"../../component/iconList/iconList" }, "navigationBarTitleText":"记一笔", "navigationBarTextStyle": "black"}

2021-05-22 21:40:22 123 3

原创 微信小程序基础学习二

微信小程序基础学习二小程序导航<navigator url="/pages/about/about">跳转到 about 页面</navigator>- url 属性设置需要跳转的路径- 页面路径应该以 / 开头,- 路径必须提前在 app.json 的 pages 节点下声明导航到 tabBar 页面<navigator url="/pages/person/person" open-type="switchTab">跳转到 tabBar 页面&lt

2021-05-21 20:59:29 134

原创 微信小程序基础学习一

微信小程序基础学习一1.小程序自学前的准备(技术就不多说啦)看下官网地址小程序官方文档里面有起步带你快速入门 。2 个人感觉小程序和VUE是非常相似的。如果你会VUE基本很快可以上手3 按照官网下载小程序开发工具可以很快生成一个小程序模板。小程序页面结构├── pages ······································ 【目录】存放所有的小程序页面│ │── index ···································· 【目录】ind

2021-05-20 23:03:00 182 3

原创 vue中使用iconfont字体图标

去iconfont官网选择想要的图标下载到本地添加链接描述2.解压下载后的文件 放入到项目中3.修改iconfont.css 中路径为相对路径4.在main.js在中引用5.打开demo.html 在项目中选择想要的样式类名6.效果...

2021-01-09 17:46:21 120

转载 vue组件中使用<transition></transition>标签过渡动画

vue组件中使用标签过渡动画<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https://unpkg.com/vue/dist/vue.js"></script> <!--2. 自定义两组样式,来控制transition

2021-01-09 17:34:39 738

原创 vue--简易轮播图组件的实现

vue–简易轮播图组件的实现轮播图在实际开发中非常常见,这边基于vue简易写了一个swiper组件这边样式由于时间问题就随意了<template> <!-- 轮播图 --> <div class="swiper" @mouseleave="mouseleave" @mouseenter='mouseenter'> <div class="img" > <img @click="linkTo(item.linkU

2020-11-01 15:20:17 3017

原创 vue动态组件使用---tab选项卡

vue动态组件使用—tab选项卡tab选项卡在项目中经常使用动态组件的使用请看vue官网实例 <!-- tab --> <ul class="tab"> <li @click='tabTaggle("recommend")'>推荐</li> <li @click='tabTaggle("hh")'>人气</li> <li @click='tabTaggle("singer")'&gt

2020-10-31 22:22:43 596

转载 Vue.extend动态组件

Vue.extend 属于 Vue 的全局 API,在实际业务开发中我们很少使用,因为相比常用的 Vue.component 写法使用 extend 步骤要更加繁琐一些。但是在一些独立组件开发场景中,Vue.extend + $mount 这对组合是我们需要去关注的。Vue.extend( options )参数:{Object} options用法:使用基础 Vue 构造器,创建一个“子类”。参数是一个包含组件选项的对象。data 选项是特例,需要注意 - 在 Vue.extend() 中它必

2020-09-05 16:50:46 1267

原创 node基础

node中文网http://nodejs.cn/api/buffer.html#buffer_class_method_buffer_allocunsafe_sizenode学习第一天md hello 新建文件夹hellord hello 删除文件夹cd …dir1.环境变量系统中的变量系统中的变量当在命令窗口中打开文件时 现在当前文件中找文件 然后再去环境变量 path的路径中寻找 可以将经常用的文件路径放到环境变量中 这样可以在cmd中一下就能访问2.进程和线程进程:为程序

2020-08-02 17:55:35 113

原创 移动端输入框中展示图片

最近在写移动端需求中需要输入框中展示选择后的图片,查了资料后找到了想要的效果

2020-06-28 23:10:55 360

转载 CSS波浪号选择器

波浪选择器用来选择所有匹配到的兄弟元素<ul><li class="something-important">Item 1</li><li>Item 2</li><li>Item 3</li><li>Item 4</li></ul>.something-important { color: red;}.something-important ~ li { fo

2020-06-03 22:04:26 1380

转载 vue 自定义步骤条组件

<template> <div> <ul class="steps"> <li v-for="(item,index) in SetData" :key="item+index" :class="{'active':Steps===index}" >{{item+Steps}}</li> </ul> </div></tem

2020-06-03 21:57:43 2487

转载 Content-type的几种常见类型

Content-type的几种常见类型程序媛提高审美.png一、是什么?是Http的实体首部字段,用于说明请求或返回的消息主体是用何种方式编码,在request header和response header里都存在。二、几个常用类型:1、application/x-www-form-urlencoded1)浏览器的原生form表单2) 提交的数据按照 key1=val1&key2=val2 的方式进行编码,key和val都进行了URL转码POST [http://www.e

2020-05-31 21:25:56 954

原创 vue v-loading自定义指令的实现

在实际项目中经常需要使用v-loading加载中的效果,这里使用简单的loading实现下

2020-05-29 23:08:39 1688 1

转载 input原生上传文件的使用

input原生上传文件的使用1.在项目中经常会用到需要上传头像,附件的地方,那么我们如何进行上传呢,今天跟大家分享一下,来自项目中的一些上传文件的个人总结2.首先我们需要在页面中使用一个 input 按钮,并将它的type属性设置为’file’,关于上传按钮美化的操作,我已经在上一篇博客中详细的讲解了.下面直接贴出代码截图若项目中需要支持上传多文件,只需要在input标签上加上 multiple属性就可以了.要想实现上传操作,还需要在变迁上定义一个change事件,用于触发上传文件发生变动时的函

2020-05-27 22:28:03 2564

原创 Object.keys方法之详解

一、语法Object.keys(obj)参数:要返回其枚举自身属性的对象返回值:一个表示给定对象的所有可枚举属性的字符串数组二、处理对象,返回可枚举的属性数组let person = {name:“张三”,age:25,address:“深圳”,getName:function(){}}Object.keys(person) // [“name”, “age”, “address”,“...

2020-04-28 22:45:10 170

原创 JS获取时间戳的方法

1.Date.parse()var timestape=Date.parse(new Date());2.valueOf()var timestape=(new Date()).valueOf();3.getTime()var timestape=new Date().getTime();4.Date.now()var timestape=Date.now();注:Date.pa...

2020-04-28 22:40:55 457

原创 easymock的使用

easymock官网:https://www.easy-mock.com 官网总是卡顿好处:可以随意创建出你想要的数据类型 基本满足你的需求 使用很简单 网上教程很多参考下就okeasy-mock 常用的几个命令"cname": "@cname",//中文人名 "id": "@id",//生成20 位数字 "title": "@ctitle",//中文title "city"...

2020-03-29 14:37:55 141

转载 ES6中Array.find()和findIndex()函数的用法详解

ES6--数组实例的find()和findIndex()用法对比 数组实例的find() 用于找出第一个符合条件的数组元素。它的参数是一个回调函数,所有的数组元素一次遍历该回调函数,直到找出第一个返回值为true 的元素,然后返回该元素,否则返回 undefined[1, 5, 10...

2020-02-24 21:35:33 386

原创 for in 和for of 的区别

最近在学习es6的知识,看到了for of 这新的循环方法,所以就测试一下和以前for in有什么不同,一下是一些不同地方,当然还有其他不同的,暂时还没有发现:for … in循环由于历史遗留问题,它遍历的实际上是对象的属性名称。一个Array数组实际上也是一个对象,它的每个元素的索引被视为一个属性。当我们手动给Array对象添加了额外的属性后,for … in循环将带来意想不到的意外效果:...

2019-12-15 22:57:53 340

转载 Object.assign()用法讲解

Object.assign()用法讲解语法: Object.assign(target, …sources) target: 目标对象,sources: 源对象 用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。const target = { a: 1, b: 2 };const source = { b: 4, c: 5 };const returnedTar...

2019-12-14 14:19:06 121

转载 JS库——Lodash的常见语法

据类型的处理函数。首先要明白的是 Lodash 的所有函数都不会在原有的数据上进行操作,而是复制出一个新的数据,不会改变原有数据。_.是Lodash 中的顶层对象,所有的方法和属性都在_.中使用。

2019-12-14 13:53:33 352

原创 includes.filter.map的用法

includes.filter.map的用法includes 用法includes()返回布尔值,表示是否找到了参数字符串 同样适用于数组1.判断字符串var str = 'hello word' console.log(str.includes('he')) // 返回的结果是true只要str存在的值,就会返回结果true,否则返回false2.判断数组 var arr...

2019-12-14 13:12:24 254

转载 flex布局介绍

写在前边网页布局,是前端入门的时候必学、必须熟练的一门技术,学到什么程度算是入门了呢?随便给你一个网站,你就可能快速的分析出网页的结构,然后搭建出模型,这是前端网页布局入门的最基本要求。作为一个前端初学者,在学习的时候可能会用到一些盒模型传统的布局方式(display + position + float),很多小伙伴用着用着就觉得这种传统布局写一些样式比...

2019-11-30 14:56:01 460

原创 export ,export default 和 import 区别 以及用法

export ,export default 和 import 区别 以及用法接上篇文章内容 ,刚开始使用组件之后一直报错, did you register the component correctly? For recursive components, make sure to provide the “name” option.我以为是需要什么name属性 加了之后也没效果,后来好久...

2019-11-23 21:31:39 138

原创 封装简易的进度条组件

一 简易的进度条封装(极简版的)最近做项目时需要一个简易的进度条 ,自己动手丰衣足食 ,话不多说上代码这里是自己偷懒 使用了element UI的对话框组件子组件 progress.vue<template><div class="com"><el-dialog title="简易的进度条组件" :visible.sync="dialogVis...

2019-11-23 21:12:43 548

原创 echartsECharts--自定义tooltip属性

最近在做项目中用到了雷达图,需要用到自定义tooltip 查了相关资料。一般的tooltip提供的简单的功能往往无法满足我们实际开发需要 ,那就动起手来 baidu吧提示框浮层内容格式器,支持字符串模板和回调函数两种形式。字符串模板,就是把相对应的模板变量进行拼串formatter: ‘{b0}: {c0}{b1}: {c1}’2.回调函数// 回调函数格式(params: Obj...

2019-11-11 21:50:27 2892

原创 使用TS做简易版的todolist

简易版的todolisthtml页面<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <...

2019-09-07 17:17:03 707

空空如也

空空如也

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

TA关注的人

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