前端开发
文章平均质量分 85
罗忠浩
曾就职于JD ,后任职于几家交易所,担任CTO。目前自由职业者。人工智能方向。
展开
-
前端编码规范-一般规范
在 web 项目中,所有的文件名应该都遵循同一命名约定。以可读性而言,减号(-)是用来分隔文件名的不二之选。同时它也是常见的 URL 分隔符(i.e. //example.com/blog/my-blog-entry or //s.example.com/images/big-black-background.jpg),所以理所当然的,减号应该也是用来分隔资源名称的好选择。请确保文件命名总是以字母转载 2017-03-17 19:01:58 · 432 阅读 · 0 评论 -
前端入门参考:写给前端入门者的chat
前端是什么 众多IT岗位中的一员,以HTML+CSS+JS开发网站、微信公众号、小程序、WEBAPP的岗位,一个夹杂与UI与后台间的岗位。工作流程为从UI处得到原型图或者效果图,在项目(网站、微信公众号、小程序、WEBAPP)中还原图片效果,然后与后台进行各种数据交互。在项目中充当一号背锅侠,项目出现问题第一个收到传唤的人。一个不受UI、后台待见,甚至不受协同开发的其他前端待见的岗位。前端,一个让原创 2017-12-15 22:58:57 · 17902 阅读 · 1 评论 -
HTML中关于空格的使用
它叫不换行空格,全称No-Break Space,它是最常见和我们使用最多的空格,大多数的人可能只接触了 ,它是按下space键产生的空格。在HTML中,如果你用空格键产生此空格,空格是不会累加的(只算1个)。要使用html实体表示才可累加,该空格占据宽度受字体影响明显而强烈。 它叫“半角空格”,全称是En Space,en是字体排印学的计量单位,为原创 2018-01-18 09:56:03 · 706 阅读 · 0 评论 -
微信小程序日历分享
由于某些原因,本周末又重新编写了一个小程序日历,作用于签到。给大家分享出来。日历长这个样子,签到功能由于需求不同,代码就不公布了。日历实现的方式与我之前分享的方法一致,如果需要签到功能可以找我为你解决。原创 2018-01-28 19:36:47 · 3440 阅读 · 4 评论 -
用箭头函数精简你的 Vue 模块 – dotdev
最近在重构一个用 Vue1.0 写的项目,我通过使用 ES6 的箭头函数来让代码在不升级 Vue2.0 的情况下变得更加简洁和统一。在这个过程中我也遇到了很多坑,所以想借此机会分享一下我从中学到的东西以及总结出来的一些规范,这些规范以后都将会落实到我的 Vue 项目中。我们最好还是通过代码示例来讲解,下面给出一段代码,我们一步一步来分析它// require vue-resource...转载 2018-02-26 21:08:59 · 2076 阅读 · 0 评论 -
使用ajax请求本地JSON文件中的数据
json文件{ "info":[ {"name":"张三","sex":"男"}, {"name":"李四","sex":"男"}, {"name":"王麻子","sex":"男"}原创 2018-02-28 13:25:29 · 8412 阅读 · 6 评论 -
在vue项目中使用echarts
该示例使用 vue-cli 脚手架搭建安装echarts依赖npm install echarts -S创建图表 全局引入 main.js// 引入echartsimport echarts from 'echarts'Vue.prototype.$echarts = echarts HTML代码:<div id="myChart" :style...原创 2018-03-06 13:53:31 · 21615 阅读 · 1 评论 -
在Vue中,关于事件冒泡
在项目中或多或少都会遇见关于事件冒泡的问题。 什么是事件冒泡: 对于父元素的事件,你的子元素也会触发,可以理解为父债子还。 对于我们而言,经常会有不想让某个子元素去触发父元素的事件,也就是说,上一辈欠的钱,别来找我要。 这个时候我们就需要来阻止事件冒泡了。 一般情况我们这样来实现:<!DOCTYPE html><html><head>...原创 2018-03-24 13:35:15 · 11955 阅读 · 0 评论 -
前端大师炼成记:初中级前端成长指南
前言 本场 Chat 需要读者具有计算机基础知识,对编程语言有一定程度的了解。主要面对的读者包括以下四类人员。熟悉其他编程语言,打算学习前端的开发者。 在校大学生或应届毕业生。 处于自学或者培训状态的学者。 工作经验不足三年的初中级前端开发人员。 只要您是一个前端学习者,或是一个一两年开发经验的人,认真读完本篇内容,您都会获得收获。前端概述 对于普通用户而言,前端就是页面所呈现...原创 2018-03-24 15:00:52 · 16753 阅读 · 2 评论 -
关于 Vue.js 的那些事儿
15年开始,在各大论坛技中,与 Vue.js 这一相关词语的内容爆炸式增长,在前端技术增速中独领风骚,迅速成为前端三巨头之一。记得在某个社区中有人这样介绍三巨头“来自 Google 的 Angular,来自 Facebook 的 React,来自开源社区的 Vue.js”,Vue.js 的成功是大家有目共睹的。回顾前端框架的发展历程,2006年 JQuery 发布至今十一年过去了,它的辉光也随...原创 2018-03-27 14:51:49 · 20571 阅读 · 0 评论 -
【前端】【请求】什么是websocket?
偶然在知乎上看到一篇回帖,瞬间觉得之前看的那么多资料都不及这一篇回帖让我对 websocket 的认识深刻有木有。所以转到我博客里,分享一下。比较喜欢看这种博客,读起来很轻松,不枯燥,没有布道师的阵仗,纯粹为分享。废话这么多了,最后再赞一个~一、websocket与http WebSocket是HTML5出的东西(协议),也就是说HTTP协议没有变化,或者说没关系,但HTTP是不支持持久连接...转载 2018-05-11 10:08:56 · 8500 阅读 · 1 评论 -
js判断对象还是数组
1.对于Javascript 1.8.5(ECMAScript 5),变量名字.isArray( )可以实现这个目的 var a=[]; var b={}; Array.isArray(a);//true Array.isArray(b)//false2.如果你只是用typeof来检查该变量,不论是array还是object,都将返回‘objec’。 此问题的一个可行的答案是是检查该变...翻译 2018-10-06 10:06:47 · 2346 阅读 · 0 评论 -
05:基础功能演练:条件渲染与列表渲染
本章主要内容:一、原生与VUE渲染的区别二、VUE的条件渲染三、VUE的列表渲染四、(条件渲染+列表渲染)结合使用条件渲染,顾名思义,将满足一定条件的内容进行渲染。我们在原生js中如何来实现对DOM进行控制,只把想要的内容呈献给用户?display、visibility我们通过对display:none进行设置,来决定dom元素是否会呈现在页面上,这样做实际上DOM任然是存在的,不...原创 2019-02-16 13:46:27 · 461 阅读 · 0 评论 -
06:基础功能演练:组件开发
组件化开发是前端所提倡的,当你掌握了基础内容之后,就可以对组件这一大块内容进行了解了,本章将向你介绍组件相关内容以及简单的组件案例。本章主要内容:一、什么是组件二、如何使用组件三、组件之间的通讯组件的概念组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素,封装可重用的代码。在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊功能...原创 2019-02-16 13:46:57 · 337 阅读 · 0 评论 -
VUE分页插件分享
最近痴迷于项目不能自拔,笔记也没怎么整理,先把项目中自己写的插件拉出来溜溜,都是基于VUE脚手架搭建出来的项目: 1.分页插件 HTML代码:<template> <div class="page-body" v-if="allPages>1"> <div> <ul> <li class="li-span">原创 2017-08-14 21:28:09 · 895 阅读 · 0 评论 -
从作用机制和性质上看待methods,watch和computed的关系
首先要说,methods,watch和computed都是以函数为基础的,但各自却都不同 而从作用机制和性质上看,methods和watch/computed不太一样,所以我接下来的介绍主要有两个对比:1.methods和(watch/computed)的对比2.watch和computed的对比作用机制上1.watch和computed都是以Vue的依赖追踪机制为基础的,它们都试图处理这样一件事情转载 2017-12-18 20:32:13 · 491 阅读 · 0 评论 -
axios.js简单教程
vue在宣布不再更新vue resource之后给大家推荐了axios。axios 简介 axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征: 从浏览器中创建 XMLHttpRequest 从 node.js 发出 http 请求 支持 Promise API 拦截请求和响应 转换请求和响应数据 取消请求 自动转换JSON数据原创 2017-12-22 10:01:54 · 21238 阅读 · 0 评论 -
【前端】【CSS】关于a标签的日常运用
a标签:超链接标签,可以用作连接。在日常前端中必不可少,但是很多时候a标签的样式却不是我门想要的,比如下划线,比如悬浮效果,比如按下效果等等..a标签具有四种状态:a:link ---未访问a:visited---已访问a:hover ---悬浮a:active--点击后四种状态都可以进行自定义设置,选择自己想要的效果a标签还有以下常用CSS属性:1.color原创 2017-04-08 11:29:58 · 562 阅读 · 0 评论 -
前段开发【移动端字体问题】
rem由来:font size of the root element,那么rem是个单位,单位大小由它第一代老祖宗的font-size的大小决定。现在前端码农们为了能在各个屏幕上看到一个健康的网页在默默的牺牲着自己的健康,因为不仅要知道rem是个单位,更重要的是要知道怎么能在不同分辨率下呈现的页面都很NB。事故造成原因:1.px单位在PC上很流行,在手机屏幕上一看,GG,同样的1转载 2017-03-17 08:54:34 · 1183 阅读 · 1 评论 -
请描述一下 cookies,sessionStorage 和 localStorage 的区别?
sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据。有了本地数据,就可以避免数据在浏览器和服务器间不必要地来回传递。sessionStorage、localStorage、cookie都是在浏览器端存储的数据,其中sessionStorage的概念很特别,引入了一个“浏览器窗口”的概念。sessionS转载 2017-04-20 19:38:46 · 689 阅读 · 0 评论 -
【JS】【跨域】js中几种实用的跨域方法原理详解
这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据。只要协议、域名、端口有任何一个不同,都被当作是不同的域。下表给出了相对http://store.company.com/dir/page.html同源检测的结果:要解决跨域的问题,我们可以使用以下几种方法:一、通原创 2017-04-25 20:01:36 · 833 阅读 · 0 评论 -
关于axios发送两次请求
因为vue-resource不在更新,vue推荐使用axios,所以使用axios。 在页面交互过程中,发现axios一定几率会发送两次请求,一次是自己设置的请求方式,还有一次是options。 关于这个问题,在各个网站寻求原因,得出以下结论: 跨域资源共享标准新增了一组 HTTP 首部字段,允许服务器声明哪些源站有权限访问哪些资源。另外,规范要求,对那些可能对服务器数据产生副原创 2017-06-24 10:12:11 · 29536 阅读 · 3 评论 -
AJAX上传文件,控制文件大小,格式
如何利用AJAX进行文件的上传,并对上传内容进行限制,在项目中总会遇见这样的问题,下面就为大家举个栗子。 HTML代码<form id="uploadForm" enctype="multipart/form-data">//enctype必须要设置为multipart/form-data <input id="file" type="file" name="avater" accept原创 2017-07-04 15:18:42 · 12658 阅读 · 0 评论 -
webstorm设置自定义注释/注解
webstorm被称为最智能的JavaScript IDE,不需要为它做过多的介绍。 在开发过程中总是需要对代码进行注解: //*+回车: /** * * @param res */或者是 //+注释内容//对内容进行介绍有的时候这样并不能满足自己的需求 所以webstorm提供了自定义功能, 下面就为大家讲解一些自己进行的设置。 1️⃣.直接原创 2017-07-04 15:48:55 · 65714 阅读 · 6 评论 -
Vue中验证码计时器的制作
关键技术: setInterval clearInterval ヽ(●-`Д´-)ノ 由于setInterval不能传递参数,导致不能直接通过参数来完成计时器。 我才用的方式为改变DOM,通过监听DOM状态来做判断。 具体方案代码如下: HTML结构: <button class="yzm-btn2" @click="sendCode()"><span id="sendMsg3">{{原创 2017-07-06 11:13:28 · 3205 阅读 · 0 评论 -
【VUE】vue分页插件share
最近痴迷于项目不能自拔,笔记也没怎么整理,先把项目中自己写的插件拉出来溜溜,都是基于VUE脚手架搭建出来的项目: 1.分页插件 HTML代码:<template> <div class="page-body" v-if="allPages>1"> <div> <ul> <li class="li-span">原创 2017-08-14 21:36:35 · 1300 阅读 · 0 评论 -
前端命名规范及常用词汇
常用词汇: (一)内容头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center登录条:loginbar 标志:logo 广告:banner 页面主体:main 热点:hot新闻:news 下载:download 子导原创 2017-08-31 11:59:48 · 2792 阅读 · 0 评论 -
【微信小程序开发】IOS与安卓样式兼容问题
1.margin在IOS中失效 在页面中元素使用margin值,在某些IOS设备下会出现失效的情况,而安卓机则正常显示,此问题暂无直接的解决方案,当前使用空DIV控制间距。 2.fixed定位问题 整个页面的fixed定位,在ios下下拉会触发下拉事件,但是没有动画效果。Android就能正常运行 flex中使用 绝对定位,ios出现严重错位,导致父级元素也会变成绝对定位,Android能达原创 2017-10-09 10:34:12 · 14607 阅读 · 2 评论 -
【前端】小程序日历控件分享
之前小程序开发需要用到日历控件,但是关于小程序可用的实在资源有限,于是就自己写了一个,如今项目上线后将它分享出来,希望能帮到需要的人。 效果图: JS代码:dateData: function () { let dataAll = []//总日历数据 let dataAll2 = []//总日历数据 let dataMonth = []//月日历数据 let原创 2017-10-26 17:07:20 · 39272 阅读 · 35 评论 -
Vue.$set()
在开发过程中,我们时常会遇到这样一种情况:当vue的data里边声明或者已经赋值过的对象或者数组(数组里边的值是对象)时,向对象中添加新的属性,如果更新此属性的值,是不会更新视图的。根据官方文档定义:如果在实例创建之后添加新的属性到实例上,它不会触发视图更新。受现代 JavaScript 的限制 (以及废弃 Object.observe),Vue 不能检测到对象属性的添加或删除。由于 Vue ...转载 2019-03-25 16:48:06 · 1025 阅读 · 0 评论