自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 mpvue PDF文件预览

小程序中PDF文件预览问题在小程序中可以ios端可以使用<web-view:src="url"></web-view>但是在Android端pdf文件会自动下载解决方案:1 通过判断 系统类型是否是ios还是Android,如果是ios端使用<web-view:src="url"></web-view>进行预览如果是Android 使用小程序文件上传预览方法// pdf功能预览 openMaterial(url) {...

2020-06-15 16:21:20 297

原创 Vue 百度富文本 多图上传顺序错乱的问题

最近使用Vue工程+百度富文本ueditor碰到一个需求 需要解决多图上传图片排序的问题 参考一篇文章可以完美解决 文章连接丢失。。。多图上传写入文本框的图片顺序和上传的顺序不一致修改两个地方第一个ueditor/dialogs/image/image.js 把_this.imageList.push(json);改为_this.imageList[$file.index()]...

2019-11-07 17:17:23 830 1

原创 原始form表单提交数据字段缺失问题

最近修改一个前后端不分离的项目 表单提交使用的是最原始的提交方式(不想吐槽了)提交数据的时候不能把输入框设置disabled=true修改为disabled=false就OK了...

2019-08-02 21:57:26 1514

原创 elementUI中input框无法输入的问题

最近发现别人项目中在输入密码的时候发现input框无法输入进去键盘都快敲坏了还是无法输入通过各种排查、还是无法解决这个问题后面无意中发现 elementUI中@input事件可以拿到当前的输入的值问题找到了 视图没有更新的问题 那么怎么解决了刷新通过this.$forceUpdate() 可以解决这个问题这样的话这个问题就解决了原因可能是由于组件嵌套太深(不...

2019-07-22 21:57:44 57322 44

原创 vue项目出现替换图片出现404的错误

最近接手了一个项目需要替换logo图标、UI设计好新的图片放进项目中出现localhost:999/images/login-logo.png找不到的错误通过各种写法 require 、 important 发现都没有用结果打印图片发现是一串地址、打印以前的图片是base64位编码结果通过看base64位相关文章和看代码发现对图片的大小做了限制 不能比以前的图片尺寸大太多 否则会出现找...

2019-07-10 14:33:09 832

原创 高德地图实现marker水波纹雷达扩散覆盖效果

高德地图上面的marker的一些方法没有百度地图多 参考了一篇关于百度地图marker雷达图的文章 博主很强大 给他点个赞具体实现思路 :每一帧改变一下circle半径即可。然后多个circle覆盖在一起,按时间差进行绘制,向外扩散时又同步缩减透明度,即可实现水波纹效果。this.map = new AMap.Map("container",{// mapSty...

2019-03-28 16:54:30 7972 3

原创 react学习之路(二)es6语法掌握

react对js基础要求比较高 es6是必备基础 let 和 const 命令 变量的解构赋值 字符串的扩展 数值的扩展 函数的扩展 数组的扩展 对象的扩展 Class 的基本语法 Set 和 Map 数据结构 Promise 对象还有其他的就不一一列举了详情可以看看阮一峰es6非常详细  http://es6.ruanyifeng.com/这里我想说几种数组 对象...

2019-02-20 16:44:38 150 2

原创 react学习之路(一)react脚手架的安装

官网链接https://github.com/facebook/create-react-appnpm install create-react-app -g 全局安装react脚手架create-react-app my-app 安装react最基本开发环境需要的第三方依赖cd my-app 进入项目npm start  运行项目浏览器访问localhost:3000 查看调...

2019-02-20 11:37:59 1502

原创 vue项目中使用webscoket心跳重连

首先在created定义心跳检测对象that.websock.send("ping")  send方法是webscoket自带的一种给服务器发送消息的方法that.heartCheck = heartCheck  表示把heartCheck对象等于在data上面定义的heartCheck 对象然后把原来的heartCheck = null 来释放掉 避免内存泄露that.ini...

2019-02-19 10:22:00 6285

原创 解决elementUI菜单在vue中切换路由不高亮的问题

场景:项目中需要用到webscoket  推送过来的信息 点击信息按钮  跳转到指定的页面 路由改变了 可是菜单还是上一次的菜单高亮elementUI 里面有个属性 通过设置这两个属性实现激活菜单的颜色active-text-color 当前激活菜单的文字颜色(仅支持 hex 格式) string — #409EFF  text-color ...

2019-01-29 16:05:59 11940 9

转载 Websocket(一)——原理及基本属性和方法

Websocket(一)——原理及基本属性和方法初次接触 WebSocket 的人,都会问同样的问题:我们已经有了 HTTP 协议,为什么还需要另一个协议?它能带来什么好处?答案很简单,因为 HTTP 协议有一个缺陷:通信只能由客户端发起。举例来说,我们想了解今天的天气,只能是客户端向服务器发出请求,服务器返回查询结果。HTTP 协议做不到服务器主动向客户端推送信息。WebSocket 协...

2018-12-26 18:17:25 375

原创 vue中webscoket 主动断开连接

我们经常碰到这个需求 在客户端退出的时候 需要断开webscoketwebscoket里面提供了一个方法 webscoket.onclose这里是无法直接清除webscoket对象 必须使用onclose方法...

2018-12-12 14:11:34 11631 5

原创 vue 中把dome拖拽封装成全局自定义指令

1 首先在vue中 我们把拖拽事件进行封装(我这里是把它取名叫common.js)2 定义一个对象3 把需要用到的封装函数写在对象里面4 导出这个对象5 在需要用到拖拽功能的组件中进行引入6 给需要拖拽的元素绑定事件 (我这里是通过标题拖动父元素类似于登录表单拖拽的形式)7 调用对象里面的方法到此vue中封装拖拽功能已经全部实现了...

2018-10-24 10:57:29 1301 2

原创 js禁止 鼠标滚轮事件

一段代码搞定 直接是禁止全局的鼠标滚轮事件  如果只需要单个模块 则把window.onload = function() {window.onmousewheel = document.onmousewheel=function() {return false}}里面的document 改为需要禁止的当前元素...

2018-10-11 13:52:17 6512 4

原创 在 vue中使用 websocket

在methods 里面初始化websocket 在created里面进行调用websocketopen() {websocket连接成功后的触的函数}websocketonmessage(e){ 数据接收后触发的函数}e为后台推送过来的数据websocketclose(){ 关闭后触发的函数}websocketerror(){连接失败后触发的函数} ...

2018-09-12 20:48:10 13944 5

转载 css盒子居中

看到标题,相信大家并不陌生。这个问题,经常会出现在面试题中。通常会要求面试者写出几种方法。那么,究竟有几种方法,每种方法的兼容情况如何,相信大家很少研究过。今天,我们就一起来看看。通常分为2种情况,已知元素的宽度或未知。我们先说说在已知的情况下,要如何设置。举例说明:有2个元素,让子元素相对于父元素水平垂直居中。 html代码:   &lt;div class...

2018-09-11 16:55:45 525

原创 vue-cli打包优化

参考文章https://github.com/kaola-fed/blog/issues/204  https://segmentfault.com/a/1190000013239622打包优化主要是三个方面 下载文件速度慢 解析JS比较慢 渲染比较慢 服务端渲染(SSR)(服务器端渲染是加载最快的一种方式)SEO优化在服务端先将JS进行解析,解析完...

2018-09-11 15:00:50 2836

原创 element ui formatter 之字段为数组

formatter 按照官方说法 最近碰到一个问题是 后台传给我的表格字段是一个数组 如何才能渲染到表格上呢  查找elementUI官方文档 发现formatter 还可以这样使用后台给的数据是这样的formatter 这样使用formatter 用来格式化内容 Function(row, column, cellValue, index)  先定义一...

2018-09-03 15:29:31 9839 11

转载 javascript通过navigator.userAgent识别各种浏览器

识别各种浏览器的实现原理是根据navigator.userAgent返回值识别:unction validBrowser(){ var u_agent = navigator.userAgent; var browser_name='Failed to identify the browser'; if(u_agent.indexOf('Firefox')&gt;-1){ brows...

2018-08-09 18:05:26 2373

原创 高德地图 动态渲染marker

data() { return { flag: true, flag2: false, dataTree: [] }; }, unitBuilding() { this.$axios .post(“sinhic-service-website/unit/building/list”, { ...

2018-08-02 17:28:49 7288

原创 elementui 三级菜单可能在IE浏览器无法点开的问题

刚刚动态渲染三级菜单后 出现了三级菜单在IE下无法点击的问题 从github上面拉了很多代码 都有这样的问题于是通过排查 发现是elementUI面包屑的原因导致 在IE下无法点击通过改造elementUI面包屑代码&lt;el-col :span="18" class="breadcrumb-container"&gt;            &lt;el-breadcrumb ...

2018-07-23 11:48:11 1182

原创 elementUI 动态渲染三级菜单

第一次使用elementUI项目 不太熟 看了网上很多列子 感觉或多或少都有问题 于是自己琢磨写出来了后台传的数据为menuList: [{name: "首页",pid: 0,id: 28,url: "/main"},{name: "实时监测",pid: 0,id: 29,url: "/monitoring",childNode: [...

2018-07-23 11:30:35 27971 15

原创 extract-text-webpack-plugin&quot; loader is used without the corresponding plugin 打包报错

这个问题之前困扰我好久 在项目发布的是需要打包 刚开始打包没问题  突然今天出错了  网上的答案千奇百怪  话不多说 直接上代码 刚开始 以为是 插件版本问题 有一些确实是版本问题 后面经过测试 和版本无关  不管是之前还是之后的版本 都没关系在build 下面的webpack.prod.conf.js 里面 只需要修改如下配置 // extract css into its own file ...

2018-07-12 15:01:11 8399 1

原创 vue 中的非父子间的通信

方法有二  一 在main.js中 创建一个vue的实例 在window下挂载 window.bus = new Vue()然后在 需要传递的数据的组件中 我这里是在home组件里面 向其他地方进行传值 在methods里面进行 handleNodeClick(data) { alert(data.id) bus.$emit('change', data) //d...

2018-07-05 15:31:41 142

转载 bootstrap-treeview树形图参数详解

简要教程bootstrap-treeview是一款效果非常酷的基于bootstrap的jQuery多级列表树插件。该jQuery插件基于Twitter Bootstrap,以简单和优雅的方式来显示一些继承树结构,如视图树、列表树等等。 插件依赖Bootstrap v3.0.3jQuery v2.0.3以上两个外部依赖文件已经经过测试可以正常使用,其他版本的Bootstrap需要另行测试。该插件不支...

2018-06-28 14:27:46 49574 11

原创 vue登录验证进行路由拦截

表单验证部分使用elementUI里面提供的简单验证办法&lt;el-form :model="ruleForm2" :rules="rules2" ref="ruleForm2" label-position="left" label-width="0px" class="demo-ruleForm login-container" autocomplete="off&

2018-06-28 14:23:06 1860

原创 vue中动态添加class类进行显示隐藏

&lt;div class="status_button"&gt; &lt;el-button type="success" @click="checkSite" &gt;查岗&lt;/el-button&gt; &lt;el-button type="danger&quot

2018-06-25 16:45:02 21944

原创 在vue中使用js排他思想 以及jQuery中的动画

1 在webpack.base.conf.js文件中如下配置  并且执行npm i jqery --save resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'vue$': 'vue/dist/vue.esm.js', '@': resolve('src'), 'scss_vars': ...

2018-06-14 20:42:29 2027

原创 vue-cli中使用高德地图

第一步 去高德地图开放平台申请密钥  高德地图开放平台第二部 在vue-cli项目目录结构 里面多了config文件夹和 utils文件夹 config.js里面是这样的  主要是导出密钥 // 高德地图 keyexport const MapKey = '你的密钥key'// 地图限定城市export const MapCityName = '武汉'utils文件夹里面 新建路一个remoteL...

2018-06-01 17:28:27 16120 8

原创 vue-cli中使用echarts

首先在vue脚手架项目中安装echarts 执行npm i echarts --save 或者cnpm i echarts --save然后在main.js中进行配置import echarts from 'echarts'Vue.prototype.$echarts = echarts然后在组件中设计echarts图表&lt;template&gt; &lt;div id="myChart...

2018-05-23 09:24:50 1463

原创 js中递归跟闭包的简单理解

首先认识一下递归js中的递归函数就是在函数体内部调用本函数;在写递归的时候一定要写条件避免进入死循环一个经典的例子 使用递归写一个阶乘的案例//通过递归求阶乘function fun(n) {if (n&lt;=1) {return 1}else {return n*fun(n-1)}}alert(fun(5))闭包的话// 一般指一个函数能够访问另一个...

2018-05-17 16:39:01 1092

原创 yapi的简单使用 ------一个神奇的模拟数据接口的工具

地址:http://yapi.demo.qunar.com/project/8403/interface/api第一步注册第二部:创建项目 第三步: 第四步:接口预览 第五步:编译接口(也就是修改接口 ) 第六步:返回参数的携带 也可以实时编译返回的json数据还可以修改header头 官方参考文档    https://yapi.ymfe.org/documents/index.html在谷歌浏...

2018-05-15 17:03:51 26469 1

原创 call apply bind的用法以及区别

对于call apply bind 大家的理解好多人的理解可能只是停留在可以改变this的指向上(当然我也是因为害怕忘记主要还是自己掌握的不牢,才写的)先来一个例子function mp() {}mp.prototype = { name: '手', tack: function() { console.log("他用" + this.name + '打我') }}...

2018-05-15 16:33:46 741

原创 vue中时间格式化组件库moment.js的使用

1 首先在vue项目中npm install moment --save2 定义时间格式化全局过滤器在main.js中 导入组件import moment from 'moment'Vue.filter('dateformat', function(dataStr, pattern = 'YYYY-MM-DD HH:mm:ss') {    return moment(dat...

2018-05-14 15:23:05 61203 1

原创 使用nginx

第一步 在https://nginx.org/en/download.html 地址上下载nginx 下载安装后会是这样的一个界面然后再conf文件中打开 nginx.conf文件修改配置文件 server { listen 8800;//这是需要监听的端口号 访问本地8800相当于打开下面配置的端口号 8889 server_name localh...

2018-05-12 10:34:37 145

原创 vue-cli axios跨域问题

首先输入命令vue init webpack + 项目名称 构建初始化vue-cli项目 npm i axios  在main.js文件中配置import axios from 'axios'Vue.prototype.$axios = axios然后  在config index.js文件中配置 以 豆瓣的接口为例assetsSubDirectory: 'static', assetsPu...

2018-05-12 10:08:56 883

原创 js数组方法的一些拓展

Array.prototype.forEach:替代for循环对数组进行循环遍历var list = [1,2,3,4,5]list.forEach(function(v,i){ // v是当前遍历的这一个元素 i是这个元素的索引 console.log('当前元素是' + v,'当前元素的索引是' + i)})Array.prototype.map:对数组进行遍历,同时会...

2018-05-08 18:03:06 1387

原创 vue的思中双向数据绑定的原理

我们在面试中经常会被问道什么是mvc 什么是 mvvm  还有双向数据绑定的原理:MVC:对项目的整体把控,M代表的是数据库中的数据,V代表的是前端的视图层,C用于处理M和V之间进行交互的业务逻辑(业务逻辑需要程序员自己控制,自己编写)MVVM:主要用于一些前端的框架,对MVC三层架构中的视图层再次进行层次划分,M是当前一个视图中需要用到的数据,V就是当前视图,VM负责M和V之间的数据调度,内部已...

2018-05-08 17:44:35 563

原创 解决使用脚手架打包后 本地不能访问的问题

很多学习vue的人在 使用脚手架进行开发后 执行npm run build 的时候会报这样的错误这一般都是缓存的问题  解决方案就是 在c盘中找到AppData\Roaming\npm-cache这个文件进行删除 然后在项目依赖中删除node_modules 执行cnpm i 重新下载包  如果没有安装cnpm 执行npm i 进行安装  再 重新 进行打包 就会生成这样的文件这个index文件是...

2018-04-28 17:13:26 1525

原创 如何在vue-cli中使用百度地图

首先第一步 搭建项目的架子 vue init webpack + 项目名称第二部就是申请密钥 http://lbsyun.baidu.com/index.php?title=%E9%A6%96%E9%A1%B5 申请密钥后 看一下百度开放平台问题反馈 http://lbsyun.baidu.com/index.php?title=FAQ/jsapi在index.html引入&lt;script t...

2018-04-28 15:55:54 12772 3

空空如也

空空如也

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

TA关注的人

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