记录
光哥是来学习的
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
JS时间格式转换 format函数
时间格式转换 format函数Date.prototype.format = function (fmt) { var o = { "M+": this.getMonth() + 1, //月份 "d+": this.getDate(), //日 "h+": this.getHours(), //小时 "m+": this....原创 2020-01-01 20:56:44 · 610 阅读 · 0 评论 -
通过href 从http跳转https失效问题 前端解决
目前,浏览器定位的功能大多数浏览器为了安全需要https协议才可使用,这就需要站点支持https协议。尝试通过a标签跳转至a目录下的index.html发现href中目标地址是https://xxx.com/a,浏览器跳转到https://xxx.com/a然后又马上跳转到http://xxx.com/a随后发现<!--错误链接--><a href="https://x...原创 2019-05-07 14:53:18 · 6905 阅读 · 1 评论 -
react-router-4、5组件外跳转路由
使用Router自定义history即可import { Router } from 'react-router-dom';import { createBrowserHistory, createHashHistory } from 'history';// 根据需要选择hash还是h5路由, 然后就能在组件外通过history.push进行编程式导航了const history = ...原创 2019-11-23 17:01:16 · 1221 阅读 · 0 评论 -
react项目中怎么使用http-proxy-middleware反向代理跨域
第一步 安装 http-proxy-middlewarenpm install http-proxy-middleware我们这里面请求用的axios,在将axios安装一下npm install axios第二步 src下创建一个 setupProxy.js文件里面书写一下代码第三步 需...原创 2019-11-23 13:12:52 · 852 阅读 · 0 评论 -
【持续更新】commonJS和ES6 import目前已解决但说不清原因的问题,搞清楚后贴上来
commonJS引入文件的一些机制出问题的代码import componentsState from "../componentsState/bbt"componentDidMount() { import(`../pages/${componentsState[this.props.componentPath]}`) .then(Component => { ...原创 2019-11-18 16:57:12 · 618 阅读 · 0 评论 -
React使用公共文件夹public
两者区别其实放在两个文件夹区别就在于是否会被webpack所处理,如果您将文件放入该public文件夹,webpack 将不会处理它,在你打包的时候,会将public文件夹直接复制一份到你构建出来的文件夹中。而src/assets目录的文件(前提你在js中有引入),它会被webpack编译,比如图片,如果你的图片小于你在webpack中的loader下设置的limit大小(可配置),它会被编译成...原创 2019-11-12 15:22:38 · 8689 阅读 · 0 评论 -
IE11中报Promise未定义
问题:项目开发环境中在IE11正常运行,打包之后发布上线在IE11中报Promise 未定义1.重要:确保webpack是2.6.1的版本,如果不是在package.json将webpack修改为”webpack”: “2.6.1” I had this issue even with adding babel-polyfill, because of a bug with webpa...原创 2019-10-30 15:24:09 · 1110 阅读 · 0 评论 -
react脚手架项目想用https方法
直接在config/webpackDevServer.config.js下面将https设置为true 或者在设置环境变量module.exports = function(proxy, allowedHost) { return { // WebpackDevServer 2.4.3 introduced a security fix that prevents remote...原创 2019-10-29 16:25:46 · 4456 阅读 · 0 评论 -
TypeScript结合React全家桶的一些类型总结(一些常用自带的类型,持续补充)
如果对Typescript不了解的可以先去官方API,学习一波TypeScript官方API(点击跳转)注意:不用清除的看懂代码,只需要了解类型即可,或者观看我其它博客可以有相应的介绍等1.React类型总览(包括React本身、router、antd的类型)1.1 React本身常用类型无状态组件,函数的类型定义,FunctionComponent<P={}>、简写FC&l...原创 2019-10-24 16:00:46 · 4954 阅读 · 0 评论 -
利用JS获取用户当前ip地址
新浪的IP地址查询接口:http://int.dpool.sina.com.cn/iplookup/iplookup.p...原创 2019-10-15 15:29:07 · 585 阅读 · 0 评论 -
Hbuilder We're sorry
当Webview窗口加载错误地址(如本地页面不存在)或者访问网络资源失败(如无法访问网络)时会自动显示默认错误页面: 可以通过以下方法自定义Webview的404等错误页面。 设置应用全局默认错误页面5+App和wap2app在应用的manifest.json文件的"plus"->"error"节点的url属性可配置自定义错误页面替换默认...原创 2019-10-05 19:45:09 · 3889 阅读 · 3 评论 -
iframe的安全问题
今天尝试在iframe中嵌入外部网站, 碰到了一些小问题.如何让自己的网站不被其他网站的iframe引用?我测试的时候发现我把iframe的src指定到github不起作用. 原来是它把X-Frame-Options设置为了DENY, 这样就禁用了别的网站的iframe引用, 避免点击劫持(clickjacking).X-Frame-Options有三个可能值: DENY, SAM...原创 2019-09-20 18:20:25 · 1729 阅读 · 0 评论 -
babel 7 的使用的个人理解
最近看了很多关于babel的使用方法,大部分在一些点上都没有说明白,同时给出的代码也很难再现,为了能够理解和防止以后自己遗忘,特写此文。首先我们要明白babel存在的意义,babel的目的就是为了解决浏览器的自身对于es语言的差异性而带来的一款工具,有了babel就首先不用担心浏览器不支持es语言这件事(当然现在的浏览器尤其是chrome对es6的支持越来越好),其实最重要的不是支持,而是解决差...原创 2019-07-17 14:15:02 · 535 阅读 · 0 评论 -
Service Worker 从入门到进阶
背景有一个困扰 web 用户多年的难题——丢失网络连接。即使是世界上最好的 web app,如果下载不了它,也是非常糟糕的体验。Service Worker 可以使你的应用先访问本地缓存资源,所以在离线状态时,在没有通过网络接收到更多的数据前,仍可以提供基本的功能(一般称之为 Offline First)。这是原生APP 本来就支持的功能,这也是相比于 web app,原生 app 更受青睐的...原创 2019-08-08 15:40:02 · 1354 阅读 · 0 评论 -
移动端html font-size动态计算设置
设计稿以750px为宽度,其中有个元素是100px,如何设置font-size,使同一段代码在不同的设备上保持一致?设计稿宽度设备宽度html font-size元素宽度css代码750px320px(iphone5)?100px1rem750px375px(iphone6/7\iphoneX)50px100px1rem750px414px...原创 2019-08-15 16:10:01 · 1838 阅读 · 0 评论 -
npm install 安装依赖报错errno: -4048,
作为前端攻城狮,和npm打交道肯定是少不了的,经常利用npm下载各种依赖,题主就经常遇到这个报错F:\demo\webpack_study\webpack4.0>npm install webpack -Dnpm ERR! path F:\demo\webpack_study\webpack4.0\node_modules\fsevents\node_modules\getpass\no...原创 2019-08-16 16:42:10 · 1943 阅读 · 0 评论 -
-webkit-overflow-scrolling:touch; ios橡皮筋效果卡屏,滚动穿透
MDN中概述 入下-webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效果.值选项1、auto使用普通滚动, 当手指从触摸屏上移开,滚动会立即停止2、touch使用具有回弹效果的滚动, 当手指从触摸屏上移开,内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。同时也会创建一个新的堆栈上下文。问题 B...原创 2019-08-22 10:51:42 · 433 阅读 · 0 评论 -
React中key的作用+防抖节流+ Set Map
react 和 vue 为什么要设置key?key的作用主要是为了 虚拟DOM 在执行 diff算法 时更快的找到对应的节点,提高diff速度,高效的更新 Virtual DOM;key值采用index和id的区别?const list 1 = [ { id: 1, name; 'test1' }, { id: 2, name; 'test2' }, { id: 3, nam...原创 2019-09-03 14:48:00 · 287 阅读 · 0 评论 -
React新生命周期--getDerivedStateFromProps
React 16是最近一年多React更新最大的版本。除了让大家喜闻乐见的向下兼容的Fiber,防止了客户端react在进行渲染的时候阻塞页面的其他交互行为。Fiber源码速览参考https://juejin.im/post/5bea68a6e51d450cb20fdd70新的生命周期过程先来看看最新版本react的生命周期图:...原创 2019-09-06 16:56:12 · 603 阅读 · 0 评论 -
IOS Safari浏览器添加桌面图标
iOS中Safari浏览器的私有属性。添加图标到主屏幕:<link rel="apple-touch-icon-precomposed" sizes="57x57" href="icon-57.png"><link rel="apple-touch-icon-precomposed" sizes="72x72" href="icon-72.png"><link...原创 2019-09-07 15:40:27 · 2494 阅读 · 0 评论 -
webApp添加到iOS桌面启动图以及图标
iOS中的safri浏览器可以将一个网页添加到桌面,当做一个独立的应用运行。当然,这里我们不讨论怎么去做一个webApp,这需要html5的相关知识和开发经验。这里我们只讲webApp添加桌面后到启动的相关细节。全屏显示:<meta name="apple-mobile-web-app-capable" content="yes" />系统顶栏的颜色(黑色和白色):<meta n...原创 2019-09-17 21:21:52 · 1649 阅读 · 1 评论 -
nodejs + express或KOA 使用babel 和 nodemon 进行项目开发以及发布
以前node中不管用什么框架,每次修改代码之后,都需要重新npm start 才能看到改动的效果,非常麻烦,所以这里引入nodemon模块,实现了不用重启也能自动更新这样的好处1.全局安装nodemonnpm install -g nodemon或者安装到本地npm install nodemon --save2.在项目目录下创建 nodemon.json 文件{ "res...原创 2019-07-16 19:52:44 · 919 阅读 · 0 评论
分享