![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
web
文章平均质量分 82
Facechat
Life is in the details
展开
-
vue 中echarts的使用
在项目项目中,需要用到图表echarts,在这就不做解释了,只是把项目中用到的echarts记录一下echarts官方地址:https://www.echartsjs.com/zh/index.htmlecharts w3c文档:https://www.w3cschool.cn/echarts_tutorial/vue-echarts:https://v-charts.js.or...原创 2019-10-30 15:29:14 · 672 阅读 · 0 评论 -
文字无限循环滚动
在项目实现过程中,需要实现文字垂直循环滚动,第一时间想到使用css实现,不过先介绍一下js实现.注:以下代码是基于vue的1.js实现原理: 实际上就是一个计时器定时执行 top ++ ,当执行到底部时,top 值置0,回到顶部继续执行滚动,但这个会有一个明显的缺点,用户会明显的的感觉到,滚动到底部时,有一个跳跃到顶部的过程实现: const...原创 2019-10-30 14:35:40 · 4684 阅读 · 0 评论 -
Lavas 安装和项目构建
了解了lavas基础之后,下面我们就需要创建一个基础的lavas项目了。环境要求一台可以正常联网的计算机并已安装较新版本的 Node.js (≥ 6.9) 和 npm (≥ 3.0)一个方便调试并支持 Service Worker 的浏览器,推荐使用 Google Chrome一个自己习惯的文本编辑器,如 Sublime Text, Web Storm 等等安装步骤安装/升级 Lavas 命令行工...原创 2018-04-28 14:52:44 · 1930 阅读 · 0 评论 -
linux创建Django项目和部署
原文链接:https://blog.csdn.net/a249900679/article/details/51527200中间有一点问题,不过也解决了,参考:https://www.cnblogs.com/tssc/p/7762998.html近几天,突然想玩玩python,就弄了个虚拟机,打算先大致搭个环境,部署一个简单的项目。如果你没有服务器或linux系统的电脑,虚拟机就是首选了。首先下载...转载 2018-06-06 14:56:35 · 19233 阅读 · 4 评论 -
electron + vue 协作开发桌面端项目
自从eclectron出现,到现在已经很久了,在这里,历史就不谈了,直接上干货。本人也是刚开始接触electron,只是对前端也能实现桌面开发有点好奇,就玩了一下,刚开始看electron的文档一脸懵,耐着性子看完了。着手写一个简单的项目,如果你着手写一个electron的项目,只需要具备两个条件,第一个你仔细阅读了electron的文档,并有了一定的了解和看法,第二你的js很熟练。所以相对于实现...原创 2018-06-13 18:52:47 · 29770 阅读 · 1 评论 -
css多行超出显示省略号
简单介绍一下单行超出显示省略号text-overflow:ellipsis;white-space: nowrap;overflow: hidden;overflow: hidden;溢出隐藏white-space: nowrap;文字不能转行text-overflow:ellipsis;隐藏的部分用...表示大招来了,多行超出显示省略号overflow: hidden;首先是溢出隐藏,不可或缺d...原创 2018-06-01 23:14:51 · 2981 阅读 · 0 评论 -
background-attachment 属性,玩心大起
今天突然有个搞电商的朋友,问我能不能实现一个背景不动,页面滚动的小特效,当时大脑一顿操作,各种实现方法想了好多,第一个想到的就是js控制,突然想到了css的background-attachment 属性,就想试试。background-attachment的属性:(注意:一定要与背景搭配使用)background-attachment的兼容性:background-attachment的兼容性还...原创 2018-06-25 17:01:02 · 2980 阅读 · 0 评论 -
直接拿来用!最火的 JavaScript 开源项目 Top 10
转自:https://blog.csdn.net/csdnnews/article/details/80878941近日,Mybridge 对 Github 上将近 250 个 JavaScript 开源项目进行了排名,并从中挑选出了 Top 10,旨在帮助开发者能找到一个对自己有所启发的有趣的项目。Top 10 的项目包含了日历、验证、人脸识别、3D 游戏、货币值、热键、走马灯效果、AWE Am...转载 2018-07-03 10:20:40 · 309 阅读 · 0 评论 -
H5和HTML5的区别
我也是一直搞混淆,总是傻傻分不清楚,看了这篇文章,总算有了一个大概的认识。感谢:foreverlikui ,参考: 博文注意注意:H5不=HTML5H5 是一个产品名词HTML5是一个技术名词对于知乎多个相关问题里批判H5的叫法,我只想说:图样图森破,上台拿衣服打个比方,如果有个人跟你说:“我要做个网站,H5的”。那TA是想让你用header、footer、nav、se...转载 2018-07-30 18:03:45 · 4673 阅读 · 0 评论 -
vue + node模仿简书
近期公司的事相对少了些,就打算学学node,毕竟一个不会node的前端不是一个好前端,不过发现自己学的不怎么样,数据库建表也是一塌糊涂,但是不管怎么说,项目也算是上线了,只能后期慢慢完善我那自己都不敢看的代码。在这里写这篇博客,只是记录一下,我在实现过程中碰到的坑。在这个项目里主要使用的是vue + node + mysql(他们都说节点配mongoDb,我就是喜欢用mysql),样式和排...原创 2018-08-09 14:25:58 · 1657 阅读 · 1 评论 -
原生websocket的那些事
HTML5 WebSocketWebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。在WebSocket API中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求,连接建立以后,客户端和服务器端就可以通...原创 2018-09-14 17:54:19 · 1603 阅读 · 0 评论 -
mavon-editor 保存的html显示问题
之前使用mavon-editor作为富文本编辑器,保存之后,在vue中直接使用v-html对返回的html数据进行展示。 预期的结果: 本应该和编辑过程中预览框里的样式相同。 实际结果: 没有任何样式。 查找问题: 1.第一次尝试 感觉应该是引入问题,but,仔细查看了很多遍...原创 2018-10-25 15:32:06 · 9413 阅读 · 8 评论 -
axios的二次封装-vue
axios基于promise用于浏览器和node.js的http客户端特点支持浏览器和node.js 支持promise 能拦截请求和响应 能转换请求和响应数据 能取消请求 自动转换JSON数据 浏览器端支持防止CSRF(跨站请求伪造)默认配置全局修改axios默认配置global.js文件信息/** * 全局常量配置 */let BASE_URL = ...原创 2018-10-26 11:03:54 · 591 阅读 · 0 评论 -
vue入门
什么是VUE?Vue.js(读音 /vjuː/, 类似于view)是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据...原创 2018-12-22 20:00:16 · 795 阅读 · 2 评论 -
99%的人都理解错了HTTP中GET与POST的区别
GET和POST是HTTP请求的两种基本方法,要说它们的区别,接触过WEB开发的人都能说出一二。最直观的区别就是GET把参数包含在URL中,POST通过request body传递参数。你可能自己写过无数个GET和POST请求,或者已经看过很多权威网站总结出的他们的区别,你非常清楚知道什么时候该用什么。当你在面试中被问到这个问题,你的内心充满了自信和喜悦。你轻轻松松的给出了一个...转载 2019-03-26 13:55:35 · 186 阅读 · 0 评论 -
前端 100 问:能搞懂80%的请把简历给我
引言半年时间,几千人参与,精选大厂前端面试高频 100 题,这就是「壹题」。在 2019 年 1 月 21 日这天,「壹题」项目正式开始,在这之后每个工作日都会出一道高频面试题,主要涵盖阿里、腾讯、头条、百度、网易等大公司和常见题型。得益于大家热情参与,现在每道题都有很多答案,提供的解题思路和答案也大大增长了我的见识,到现在已累积 100 道题目,『 8000+ 』Star 了,可以说你面...转载 2019-07-09 15:04:07 · 997 阅读 · 0 评论 -
Lavas的简单入门
对于lavas的接触也是十分偶然的,我在开始的时候,只是对PWA(Progressive Web App)比较感兴趣,想深入的了解一下相关的原理和使用。PWA1.PWA介绍 Progressive Web App, 简称 PWA,是提升 Web App 的体验的一种新方法,能给用户原生应用的体验。PWA 能做到原生应用的体验不是靠特指某一项技术,而是经过应用一些新技术进行改进,在...原创 2018-04-28 14:39:13 · 2065 阅读 · 0 评论 -
下一代 Web 应用模型 — Progressive Web App
刚开始接触Progressive Web App,作为一名前端感觉这个挺有趣的,就想深入了解一下,下面这篇是转载自黄玄的一篇博客,算是简单了解一下。今年 9 月份的时候,《程序员》杂志社就邀请我写一篇关于 PWA 的文章。后来花式拖稿,拖过了 10 月的 QCon,11 月的 GDG DevFest,终于在 12 月把这篇长文熬了出来。几次分享的不成熟,这次的结构算是比较满意了。「 可能是目前中文...转载 2018-04-27 14:21:30 · 6989 阅读 · 0 评论 -
Progressive Web App
本文转载于google.com的《你的首个 Progressive Web App》一文,如需转载,请注明出处:https://developers.google.com/web/fundamentals/getting-started/codelabs/your-first-pwapp/Progressive Web Apps 是结合了 Web 和 原生应用中最好功能的一种体验。对于首次访问的用...转载 2018-04-27 14:07:48 · 587 阅读 · 0 评论 -
日历考勤记录
一个简单的日历考勤记录项目中需要一个日历考勤功能,可以对员工的考勤,以一个直观的日历形式展示出来,比如绿色代表正常,黄色代表迟到,等。下面的代码就是对此功能的一个简单实现,当然啦,代码还不完善,不过已经做到一个大致的展示,需要的小伙伴们可以根据自己的需求做相应的改动。<!DOCTYPE HTML><html lang="zh_CN"><head>...原创 2017-08-24 20:48:27 · 7704 阅读 · 0 评论 -
iview 爬坑 menu
iview menu 动态数据绑定menu绑定非动态数据是正常的,而绑定动态数据,需要手动更新activeMenu第一:为menu绑定 ref 例如:ref="side_menu" :active-name="activeMenu=='/index/'?'/index':activeMenu" theme="dark" width="auto" @on-select="select原创 2017-11-11 14:40:32 · 12605 阅读 · 1 评论 -
fabric.js 在vue中的使用
Fabric.js 用法总结(在vue中使用时,因为this的指向不同,所以在Fabric.js方法内部,this是无法使用指向外部的值的)这只是我在使用fabric.js的过程中的一些总结,文章底部有一个fabric入门的链接,新手入门可以先看一下,适合新手1.canvas.setBackgroundImage(require('../assets/logo.png')...原创 2017-08-08 09:23:39 · 13807 阅读 · 5 评论 -
json操作
1.json类型的字符串转换为json对象及取值1 var jsonString = '{"bar":"property","baz":3}';2var jsObject = JSON.parse(jsonString);//转换为json对象3 alert(jsObject.bar); //取json中的值 2.json对象转为json类型的字符串var原创 2017-11-21 19:20:45 · 209 阅读 · 0 评论 -
fabricjs 删除object对象
fabricjs对于学习过fabric的人来说,对于canvas的操作,算是相当简化了,一些基础的操作我在这里就不多少了,网上有很多介绍,而且官网也是很详细的。下面我说一下删除fabricjs中canvas的对象。对于删除canvas 中的对象,fabricjs也提供了一个方法,remove(),可以移除指定对象。但是,有一个小小的问题,我们在什么情境下或者什么条件下,执行移除操作原创 2017-12-09 13:25:08 · 10259 阅读 · 11 评论 -
vue 刷新当前路由
1.路由介绍vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用。vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来。传统的页面应用,是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中,则是路径之间的切换,也就是组件的切换。2.刷新路由对于路由,不同的路由跳转,vue会帮我们刷新路由...原创 2017-12-09 13:50:59 · 38132 阅读 · 4 评论 -
js 时区对应的时间转换
js 各个时区时间转换//得到标准时区的时间的函数function getLocalTime(i) { //参数i为时区值数字,比如北京为东八区则输进8,西5输入-5 if (typeof i !== 'number') return; var d = new Date(); //得到1970年一月一日到现在的秒数 var len = d...转载 2017-11-24 20:03:49 · 19175 阅读 · 7 评论 -
系统环境安装
# ******************系统环境******************# 安装nano编辑器,GITyum install -y nano git# 安装Nginxyum install -y epel-releaseyum install -y nginxsystemctl start nginxsystemctl enable nginx# 安装S原创 2017-11-24 20:08:12 · 238 阅读 · 0 评论 -
Vue 列表渲染性能优化原理
Vue列表渲染性能优化原理Vue 是一个高效的 mvvm 框架,这得益于作者已经帮我们框架内部做了足够的优化,比如各个细节的缓存( parseText 结果的缓存,compile 编译结果的缓存等)。大列表是容易造成性能问题的地方,一不小心就会造成大量的重绘和重排。Vue 的列表渲染实现在 v-for 指令的 update 方法, 性能优化的大部分细节在 diff 函数。列表渲染时会为转载 2017-11-27 11:31:08 · 8690 阅读 · 0 评论 -
前端 下载excel文件
前端 下载excel文件最简单的形式,前端正常请求,后端返回一个静态文件链接,使用a标签的download方法代码实现:var a = document.getElementById('alink')a.setAttribute('href', this.downloadUrl)a.setAttribute('download', reportName)a.click...原创 2017-12-25 19:54:46 · 7685 阅读 · 2 评论 -
vue webpack error
vue webpack error对于现阶段而言,浏览器只识别es5,而无法识别es6,简单的说,es6代码在浏览器里会报错。这是在webpack压缩文件时,出现未转化的es6语法,导致报错。简单的解决办法:找到错误点,例如当前的错误出现在node_modules里的jsdom文件夹下,你只需要修改webpack.base.conf.js文件,include中加入报原创 2018-01-16 21:59:01 · 876 阅读 · 0 评论 -
Date 的 toLocaleTimeString() 格式问题
一般 Data的 toLocaleTimeString() 方法输出的时间格式为上午 08:09:07 和 下午 03:23:23这两种形式。但有时,我们需要显示的格式是 08:09:07 和 15:23:23,不需要上午和下午这两个中文时间指示。大致思路:先判断是上午还是下午,如果是上午,只需要获取时间字符串的时间就可以了(也就是截去时间戳的前两个中文)如果是下午,则原创 2017-12-06 16:14:07 · 9157 阅读 · 5 评论 -
vue项目的webpack构建优化
vue项目的webpack构建优化值得一提的是,在说webpack的速度优化之前,按需加载和按需引入,是你先要做好的,之后再说速度优化的问题。按需加载,参考:https://segmentfault.com/a/1190000011519350对参考博客中的一些问题的补充,当前router.js中代码为const Index = () => import('@/compo...原创 2018-02-06 18:42:38 · 5078 阅读 · 0 评论 -
redux最浅显易懂的入门
原文链接(保持更新):https://github.com/kenberkeley/redux-simple-tutorial参考(demo阮一峰):https://github.com/zrysmt/react-demo写在前面本教程深入浅出,配套 简明教程、进阶教程(源码精读)以及文档注释丰满的 Demo 等一条龙服务§ 为什么要用 Redux当然还有 Flux、Reflux、Mobx 等状态...转载 2018-04-18 09:34:21 · 432 阅读 · 0 评论 -
redux的进阶教程(相对其他讲解浅显易懂)
原文(保持更新):https://github.com/kenberkeley/redux-simple-tutorial/blob/master/redux-advanced-tutorial.md写在前面相信您已经看过 Redux 简明教程,本教程是简明教程的实战化版本,伴随源码分析Redux 用的是 ES6 编写,看到有疑惑的地方的,可以复制粘贴到这里在线编译 ES5§ Redux API ...转载 2018-04-18 09:35:58 · 456 阅读 · 0 评论 -
用CSS/CSS3 实现 水平居中和垂直居中的完整攻略
用CSS/CSS3 实现 水平居中和垂直居中的完整攻略水平居中:行内元素解决方案只需要把行内元素包裹在一个属性display为block的父层元素中,并且把父层元素添加如下属性即可: .parent { text-align:center;}水平居中:块状元素解决方案 .item { /* 这里可以设置顶端外边距 */ margin: 10px auto;}水平居中...转载 2018-04-25 15:42:22 · 333 阅读 · 0 评论 -
Web端轻松实现音视频聊天通话
网络上视频主播的火热带动了网络视频聊天室开发行业的火热。现在网上企业或者工作室在弄网页的视频聊天室。通过个人学习,借用别人的开发Demo(AnyChat SDK,网上随便搜索一下就可以下载的),加上几十行JavaScript脚本就能轻松实现视频通话;也不用去下载指定的什么浏览器,因为IE、firefox、chrome等windows平台主流浏览器全部通过,完美运行。下边就跟大伙分享分享我的成果转载 2017-04-27 13:58:41 · 32325 阅读 · 4 评论