Html
JoeBlackzqq
爱好网络软件的开发,更喜欢结交志同道合的朋友!
展开
-
常用的前端大屏 适配方案
scale1.通过 scale 属性,根据屏幕大小,对图表进行整体的等比缩放1.代码量少,适配简单2.一次处理后不需要在各个图表中再去单独适配 3.文字,图片等大小均能自动适配1.因为是根据 ui 稿等比缩放,当大屏跟 ui 稿的比例不一样时,会出现周边留白情况2.当缩放比例过大时候,字体会有一点点模糊,就一点点3.当缩放比例过大时候,事件热区会偏移。它其实也是通过 scale 进行等比例计算放大和缩小的,和方案二的原理是一样的,还可以通过api调整样式,源码地址和对应的API。转载 2023-01-14 20:42:51 · 2195 阅读 · 0 评论 -
JSON.parse 解析json字符串时,遇换行符报错
Json字符串转换成Json对象时候,有两种方式:假设d是json字符串:1,eval('(' + d + ')')。2,JSON.parse(d);但是以上方式有隐患,如果Json字符串有换行的话,这样转换就会报错。假如有这样一个字符串:var json='{"CityName":"西安","CityOrder":"物料::WAA010001\n物料名称::轴承\n规格型号::HRB1209\n供应商::东莞市耀光化工贸易有限公司\n采购员::\n请购部门:: \n批号::J转载 2021-11-19 08:20:21 · 3636 阅读 · 0 评论 -
react 父子组件之间相互传值
From: https://blog.csdn.net/luzhaopan/article/details/850033621、定义父组件 import React, { PureComponent } from 'react'; export default class Father extends PureComponent { re...转载 2019-07-14 21:25:08 · 1658 阅读 · 0 评论 -
Moment.js常见用法总结
From: https://www.jianshu.com/p/9c10543420deMoment.js常见用法总结Moment.js是一个轻量级的JavaScript时间库,它方便了日常开发中对时间的操作,提高了开发效率。 日常开发中,通常会对时间进行下面这几个操作:比如获取时间,设置时间,格式化时间,比较时间等等。接下来,我将按照这些操作对Moment.js中的Doc进行整...转载 2019-07-14 20:40:51 · 335 阅读 · 0 评论 -
我为什么要立刻放弃 React 而使用 Vue?
From: https://baijiahao.baidu.com/s?id=1607323518011007619&wfr=spider&for=pcCSDN发布时间:18-07-29 19:28现在,Vue.js 在 Github 上得到的星星数已经超过了 React。这个框架的流行度在不断增长,由于它并没有像 Facebok(React)或 Goo...转载 2019-07-10 13:29:43 · 258 阅读 · 0 评论 -
2019年最流行的10个前端框架
From: http://blog.sina.com.cn/s/blog_18337e9c40102yt1x.html2019年最流行的10个前端框架从去年下半年开始,互联网行业慢慢进入寒冬,一些设计师也不得不重新找工作。关于求职这个事情,UI黑客之前写过一篇文章《面试了50多位UI设计师,我总结了这些求职技巧!》,大家可以参考下。打铁还需自身硬,找工作最重要的还是靠自身的能力。那...转载 2019-06-28 21:56:42 · 895 阅读 · 0 评论 -
thinkphp 前端页面js接收后端传过来的数据
后端接口:前端页面:原创 2019-06-28 21:24:00 · 4081 阅读 · 3 评论 -
Spring Boot配置跨域访问策略
From: https://blog.csdn.net/garyond/article/details/801927601. 引言我们在开发过程中通常因为不同应用之间的接口调用或者应用之间接口集成时经常会遇到跨域问题, 导致无法正常获取接口数据,那么什么是跨域? 跨域的解决办法是什么? 下面结合Spring Boot相关的项目应用实战, 详解说明跨域的解决方案。1.1 什么是跨域(COR...转载 2019-04-04 15:27:42 · 445 阅读 · 0 评论 -
ajax跨域,这应该是最全的解决方案了
From: https://segmentfault.com/a/1190000012469713前言从刚接触前端开发起,跨域这个词就一直以很高的频率在身边重复出现,一直到现在,已经调试过N个跨域相关的问题了,16年时也整理过一篇相关文章,但是感觉还是差了点什么,于是现在重新梳理了一下。个人见识有限,如有差错,请多多见谅,欢迎提出issue,另外看到这个标题,请勿喷~题纲关于跨...转载 2019-04-04 15:12:10 · 196 阅读 · 0 评论 -
SpringBoot配置Cors解决跨域请求问题
From: https://www.cnblogs.com/yuansc/p/9076604.html一、同源策略简介同源策略[same origin policy]是浏览器的一个安全功能,不同源的客户端脚本在没有明确授权的情况下,不能读写对方资源。 同源策略是浏览器安全的基石。什么是源源[origin]就是协议、域名和端口号。例如:http://www.baidu.com:80这...转载 2019-04-04 15:10:15 · 234 阅读 · 0 评论 -
laravel+vue开发环境搭建
From: https://www.jianshu.com/p/1c2cc11ba46f描述最近通过laravel在公司做了一些项目,但本身前端出身的我,总是感觉lphp开发过程中,前端写好页面,然后后端还需要再套blade模板,感觉这样开发效率太慢,太low。于是自己抽了空闲时间,在laravel中搭了vue开发环境。这样感觉前后端分离,开发更有效率。而且我更喜欢这种前后分离的开发模式...转载 2019-07-19 16:37:55 · 705 阅读 · 0 评论 -
ant-design table 分页(tableProps)
From: https://www.cnblogs.com/crazycode2/p/9704382.html1.布局 1 2 3 4 5 6 7 8 9 10 11 12 13 14 <Table dataSource={this.stat...转载 2019-07-30 14:39:09 · 1377 阅读 · 0 评论 -
[vue] 父子组件间传值
环境说明: vue 3.x + ant-vue父组件(Album.vue)使用:<template> <div> <a-button type="primary" icon="plus" @click="uploadImage">图片</a-button> <upload-image :visible.sync="...原创 2019-08-31 15:04:42 · 265 阅读 · 0 评论 -
Postman发送请求时带上登录信息
正常情况下,没有登录验证等公共接口,用postman进行get或post请求都很方便,加上相应的参数就行。但是对于某些接口,可能需要先登录后才能请求,这时如果按正常的思路请求,可能就会被拦截了。对于这种情况,可以通过以下方式:1. 打开浏览器,正常登录后,再请求你要的接口,应该能请求成功,这时查看请求头:看了下请求头中,感觉最有用的可能就是这个Cookie了,所以尝试将它添加到...原创 2019-08-16 10:06:12 · 4641 阅读 · 0 评论 -
vue 3.x 中使用ele-image时相对路径的图片加载失败
参考文档: https://element.eleme.cn/#/zh-CN/component/installation环境: Mac OS X 10.12[zcm@ele 2]$node -vv12.6.0[zcm@ele 3]$npm -v6.9.0[zcm@ele 4]$cnpm -vcnpm@6.1.0 (/usr/local/lib/node_modules/cn...原创 2019-08-09 11:13:32 · 2702 阅读 · 0 评论 -
关于sass(scss)、less、postcss、stylus等的用法与区别
一. Sass/Scss、Less、stylus是什么?它们都是css预处理器。css预处理器的概念:CSS预处理器用一种专门的编程语言,进行Web页面样式设计,然后再编译成正常的CSS文件,以供项目使用。CSS预处理器为CSS增加一些编程的特性,无需考虑浏览器的兼容性问题。 比如说:Sass(SCSS)、LESS、Stylus、Turbine、Swithch CSS、CSS Cacheer、...转载 2019-08-08 21:27:39 · 3234 阅读 · 2 评论 -
path.join 和 path.resolve的区别
path.joinpath.join() 方法使用平台特定的分隔符把全部给定的 path 片段连接到一起,并规范化生成的路径。path.join([...paths]);...paths string类型path.join(__dirname, './02art-template.js');// 'C:\Users\liangliang17\Desktop\Node_stud...转载 2019-08-02 12:01:17 · 442 阅读 · 0 评论 -
cnpm与npm的区别
From: https://blog.csdn.net/chi1130/article/details/72773278npm介绍说明:npm(node package manager)是nodejs的包管理器,用于node插件管理(包括安装、卸载、管理依赖等)使用npm安装插件:命令提示符执行npm install [-g] [–save-dev]:node插件名称。例:npm i...转载 2019-08-01 00:01:27 · 576 阅读 · 0 评论 -
exports、module.exports和export、export default到底是咋回事
前言难得有空,今天开始重新规范的学习一下node编程。但是引入模块我看到用 require的方式,再联想到咱们的ES6各种export 、export default。阿西吧,头都大了....头大完了,那我们坐下先理理他们的使用范围。require: node 和 es6 都支持的引入export / import : 只有es6 支持的导出引入module.exports /...转载 2019-08-04 21:21:03 · 215 阅读 · 0 评论 -
springboot跨域配置
From: https://www.cnblogs.com/nananana/p/8492185.html前言:当它请求的一个资源是从一个与它本身提供的第一个资源的不同的域名时,一个资源会发起一个跨域HTTP请求(Cross-site HTTP request)。比如说,域名A (http://domaina.example) 的某 Web 应用程序中通过< img>标签...转载 2019-04-04 14:32:32 · 685 阅读 · 0 评论 -
前端安全配置之Content-Security-Policy(csp)
From: https://www.cnblogs.com/heyuqing/p/6215761.html什么是CSPCSP全称Content Security Policy ,可以直接翻译为内容安全策略,说白了,就是为了页面内容安全而制定的一系列防护策略. 通过CSP所约束的的规责指定可信的内容来源(这里的内容可以指脚本、图片、iframe、fton、style等等可能的远程的资源)。通...转载 2019-04-04 11:37:10 · 2989 阅读 · 0 评论 -
Content Security Policy 入门教程
From: http://www.ruanyifeng.com/blog/2016/09/csp.html跨域脚本攻击 XSS 是最常见、危害最大的网页安全漏洞。为了防止它们,要采取很多编程措施,非常麻烦。很多人提出,能不能根本上解决问题,浏览器自动禁止外部注入恶意脚本?这就是"网页安全政策"(Content Security Policy,缩写 CSP)的来历。本文详细介绍如何使...转载 2019-04-04 11:34:26 · 371 阅读 · 0 评论 -
[QUICK UI] 有哪些目前流行的前端框架
From: https://blog.csdn.net/qianduankuangjia/article/details/78185047 使用前端框架其实和开发的项目有一定的关系,因为在不同的项目中可能会用到不同的组件功能,这样说可能有一点片面,但是在面临几十种再做出选择的时候确实有一定的难度,难道每一种我都要去熟悉?这是不可能的事情,所以在了解过程中就应该知道其中有哪些适合自己的插件功能...转载 2018-08-23 10:58:49 · 2149 阅读 · 0 评论 -
[CSS] 眼下最流行的五大CSS框架,你都知道么?
From: http://developer.51cto.com/art/201710/555733.htm如今,CSS框架越来越受欢迎,可以说已经应用到每一个网站上了。作为开发工具,CSS框架一直处于不断进化和改进的状态,因此我们强烈建议您关注眼下的趋势。这篇文章会带您了解2017年最流行的5种CSS框架。1. Bootstrap这个框架是GitHub的明星产品之一,被认为是拥有最好...转载 2018-08-23 10:49:28 · 471 阅读 · 0 评论 -
Flex 布局教程:语法篇
From: http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html作者: 阮一峰日期: 2015年7月10日网页布局(layout)是 CSS 的一个重点应用。布局的传统解决方案,基于盒状模型,依赖 display 属性 + position属性 + float属性。它对于那些特殊布局非常不方便,比如,垂直居中就不容易实...转载 2018-08-22 12:40:42 · 206 阅读 · 0 评论 -
浮动的清除 -- 四种方法
From: https://www.cnblogs.com/gchlcc/p/5824200.html前言 -- 一个父亲不能被自己浮动的儿子,撑出高度。开胃小菜来看一个实验:现在有两个div,div身上没有任何属性。每个div中都有li,这些li都是浮动的。我们本以为这些li,会分为两排,但是,第二组中的第1个li,去贴靠第一组中的最后一个li了。第二个div中的li,...转载 2018-08-08 10:32:12 · 187 阅读 · 0 评论 -
几种常用的清除浮动方法(一)
From: https://www.cnblogs.com/nxl0908/p/7245460.html1、父级div定义伪类:after和zoom<style type="text/css"> .div1{background:#000080;border:1px solid red;} .div2{background:#800080;border:1p...转载 2018-08-08 10:30:39 · 232 阅读 · 0 评论 -
如何在网页标题栏title加入logo(icon)图标?
From: https://www.cnblogs.com/lyp123/articles/5661661.html打开某一个网页会在浏览器的标签栏处显示该网页的标题和图标,当网页被添加到收藏夹或者书签中时也会出现网页的图标,怎么在网页title左边显示网页的logo图标呢? 方法一(被动式): 制作一个ico格式的图片,将图片命名为favicon.ico,像素大小为16*16...转载 2018-08-02 09:44:08 · 1400 阅读 · 0 评论 -
html页面通过特殊链接:打电话,发短信,发邮件详细教程
From: http://www.cnblogs.com/liuhongfeng/p/4976599.html采用url href链接的方式,实现在Safari ios,Android 浏览器,webos浏览器,塞班浏览器,IE,Operamini等主流浏览器,进行拨打电话功能。 1. 拨打电话在电话号码前面可以加上 + (加号)表示国际号码。如:最常用WEB页面JS实现一键拨号...转载 2018-08-10 10:08:19 · 2293 阅读 · 0 评论 -
2018年五大最佳前端框架比较,程序员会怎么选?
From: https://blog.csdn.net/qq_41852103/article/details/79619250现在有大量的CSS前端框架可用。但真正好的屈指可数。本文将比较五个最佳前端框架,每个框架都有自己的长处和短处,以及特定的应用领域,使你可以根据特定项目的需求进行选择。例如,如果项目很简单,则不需要使用复杂的框架。此外,许多选项都是模块化的,只允许使用你需要的组件,甚至...转载 2018-08-23 11:01:41 · 1028 阅读 · 0 评论 -
前端开发框架对比
From: https://www.cnblogs.com/xtdxs/p/6540933.html本文选取了 Bootstrap、jQuery UI、jQuery Mobile、Sencha ExtJS、Sencha Touch、Sencha GXT、Dojo、Dojo Mobile、Mootools、Foundation、YUI、Kissy、QWrap 等 16 个国内外前端开发框架进行初...转载 2018-08-23 11:06:19 · 393 阅读 · 0 评论 -
从零开始搭建自己的VueJS2.0+ElementUI单页面网站(一、环境搭建)
From: https://blog.csdn.net/u012907049/article/details/72764151版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u012907049/article/details/72764151前言VueJS可以说是近些年来最火的前端框架之一,越来越多的网站开始使用vuejs作为前端框架...转载 2018-08-23 11:38:14 · 665 阅读 · 0 评论 -
【分享】vue init webpack vue-demo时配置.eslintrc.js和.editorconfig
.eslintrc.js// https://eslint.org/docs/user-guide/configuringmodule.exports = { root: true, parserOptions: { parser: "babel-eslint" }, env: { browser: true, es6: true }, extends: [ ...原创 2019-03-08 10:36:26 · 381 阅读 · 0 评论 -
一张图看懂encodeURI、encodeURIComponent、decodeURI、decodeURIComponent的区别
From:https://www.cnblogs.com/shuiyi/p/5277233.html一、这四个方法的用处1、用来编码和解码URI的统一资源标识符,或叫做 URI,是用来标识互联网上的资源(例如,网页或文件)和怎样访问这些资源的传输协议(例如,HTTP 或 FTP)的字符串。除了encodeURI、encodeURIComponent、decodeURI、decodeUR...转载 2019-03-08 16:51:09 · 143 阅读 · 0 评论 -
[JS] Invalid Date
一般mysql存储的时间字段格式是" YYYY-MM-DD hh:mi:ss",即年月日之间是通过'-'分隔的。偶然的情况下,发现这样的格式用在js时,在手机浏览器上运行会失败,但是在PC浏览器上却是OK的。见代码: const st = '2019-02-11 10:04:38'; // 手机浏览器上bad(NaN) // const st = '2019/02/11 10:...原创 2019-03-06 10:13:36 · 2889 阅读 · 0 评论 -
vue 开发规范
From: https://blog.csdn.net/qq_36263601/article/details/79854742Vue组件化开发 单文件系统,样式局部作用域 基本组成结构:<template/> <script/> <style scoped/> 组件注册方式:1)公共组件全局注册 2)其余组件局部注册组件命名规...转载 2019-02-28 11:45:04 · 259 阅读 · 0 评论 -
A Complete Guide to Flexbox
From: https://css-tricks.com/snippets/css/a-guide-to-flexbox/BackgroundBasics & TerminologyProperties for the Parent(flex container)displayThis defines a flex container; inline or blo...转载 2019-02-22 10:55:08 · 332 阅读 · 0 评论 -
vh,vw单位你知道多少?
From: https://mp.weixin.qq.com/s/G7ZYCiO__4g2LjRuNl32Ew响应式布局的单位我们第一时间会想到通过rem单位来实现适配,但是它还需要内嵌一段脚本去动态计算跟元素大小。 比如: (function (doc, win) { let docEl = doc.documentElement let resizeEvt = 'or...转载 2018-08-23 11:59:54 · 1860 阅读 · 0 评论 -
css3新单位vw、vh、vmin、vmax的使用详解(附样例)
From: http://www.hangge.com/blog/cache/detail_1715.html像 px、em 这样的长度单位大家肯定都很熟悉,前者为绝对单位,后者为相对单位。CSS3 又引入了新单位:vw、vh、vmin、vmax。下面对它们做个详细介绍。 一、基本说明1,vw、vh、vmin、vmax 的含义(1)vw、vh、vmin、vmax 是一种视窗单位...转载 2018-08-23 11:58:19 · 2302 阅读 · 0 评论 -
div内部元素水平,垂直居中,多div水平排列
html:<!DOCTYPE html><html><head> <script src="https://code.jquery.com/jquery-latest.js"></script></head><body> <div class="cont原创 2018-08-09 13:49:44 · 9743 阅读 · 0 评论