罗莱特-CSDN博客

原创关于IE滚动导致fixed布局晃动的处理

这里写自定义目录标题方法一.设置选项，取消平滑滚动方法2通过代码内部处理document.addEventListener('wheel',function(event){ event.preventDefault() const wd = event.deltaY const csp = window.document.documentElement.scrollT...

2020-05-08 15:49:03 362 1

原创 Web SQL(web数据库)新

@TOCWeb SQL(web数据库)#核心语法openDatabase 创建新数据库或者打开现有的数据库transaction 创建事务executeSql 执行SQLopenDatabase 用法const db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024);const db = openDatabase(...

2020-04-08 17:51:45 572

原创关于TypeScript和React的使用

TS和React的使用接口与类型type与interface内置的语法糖Partial和ReadonlyOmitExclude (继承)接口与类型type与interface内置的语法糖Partial和ReadonlyPartial将传入的属性变为可选type Oc= Partial type Partial<T> = { [P in keyof T]?: T[...

2020-04-07 13:20:44 450

原创 IOS fixed 上拉布局错乱问题

在IOS 9 10 中界面上拉会出现按钮实际位置和显示位置不一致的情况经过多次测验.在界面拉到底部时才会出现解决方案: 监听滚动在页面拉倒底部时定位页面滚动高度.使其回弹上代码...

2019-11-27 15:58:55 431

原创 JS 实现下载图片并且重命名

getBase64=(val)=>{ const _this=this window.URL = window.URL || window.webkitURL; const xhr = new XMLHttpRequest(); xhr.open("get", val, true); xhr.res...

2019-10-28 17:09:24 2650

原创 Mobx从傻子到入门

一.首先环境配置1安装mobx mobx-reactnpm install --save mobx mobx-react2.安装修饰符 npm i --save-dev babel-plugin-transform-decorators-legacybabelrc配置可以在package.json里边改 "babel": { "plugins": [ ...

2019-10-12 15:23:44 176

原创 H5与原生app的三种交互方式

1.app 调用 h5 的代码与app进行预定。H5暴露全局方法提供给app调用代码`javascriptwindow.sdk = {double = value => value * 2, triple = value => value * 3,};android：webview.evaluateJavascript('window.sdk.double(10)'...

2019-09-16 10:31:01 6443

原创 React.js 的 context的实现原理

function sum(number1) { return function(number2) { return number1+number2 } } console.log(sum(1)(2)); //3 一个高级的点的写法推荐一个详细的讲解：https://blog.csdn.net/weixin_339...

2019-09-10 09:55:24 3128 1

原创我所知道的mysql

1.菜鸟篇 1.1 安装（首先我装的windows,因为我懒的装别的系统。有什么用什么）首先到官网下载(我下载的5.7）,下载好找个自己要的目录压缩放进去。1.到这里就遇到第一个坑了。提前改好建立data文件夹 5.7不会自己建2.添加配置文件my.ini ，可以配置什么不做深究。[client]# 设置mysql客户端默认字符集default-chara...

2019-09-02 18:06:14 83

原创 React问题总结

1. 事件返回的event.target.value为null 2. 3.解决方式：在事件中调取e.persist()React事件处理将接受SyntheticEvent实例,它封装了浏览器原生事件对象，并对浏览器做了兼容合成事件是池化,SyntheticEvent会被重用，当回调函数被执行后属性也将被销毁，通俗讲当一个事件响应函数执行过后，事件的属性被设置为 null因此不能异步访问e...

2019-08-12 10:57:41 238

原创 node.js fs模块整理

const fs = require('fs');//打开文件fs.open('./home', 'rs+', (err, fd) => { if (err) { return console.error(err); } console.error(fd); console.log("文件打开成功！");})// 获取文件信息fs.s...

2019-07-15 18:00:54 108

原创 Web SQL (web数据库)

三核心方法openDatabase:创建新数据库或使用现有数据库var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024);var db = openDatabase('数据库名称', '版本号', '描述文本', '大小',回调方法);transaction：创建事务在这里要特别提示一下.每次的事件...

2019-04-12 19:29:01 2115

原创 React生命周期新旧对比

16之前16版本后

2019-04-11 16:03:39 376

原创 Vue 生命周期

生命周期钩子:beforeCreate(){} 组件实例被创建,组件属性计算之前触发created(){} 组件实例被创建,属性已绑定但是DOM还未生成,$el属性还不存在beforeMount(){} 模板编译/挂载之前mounted(){} 模板编译/挂载之后beforeUpdate(){} 组件更新之前updated...

2019-04-11 14:44:47 70

原创 TypeScript+Vue+vuetify的项目搭建

最近重构新的项目.技术栈已经定位了Vue,但是要兼容移动端的使用.该项目属于核心项目.综合考虑后采用了 TypeScript 和vuetify的技术来重构启用非常方便的vue ui 创建新的项目功能选择配置选择安装依赖包 aioxs Vuetify material-design-icons-iconfont Vuetify的以来图标引入包main...

2019-02-25 18:57:08 2929

原创 Node基础知识(编辑中)

Node的四个模块net,dgram、http、https,分别用于处理TCP、UDP、HTTP、HTTPS，适用于服务器端和客户端TCP服务的事件通过const net=net.createSercer()实例化创建服务器服务器事件1.listeningnet.listen(port,function()=>{})服务器绑定端口 ,2.connection 客户端连...

2019-02-25 17:16:40 107

原创 CSS性能优化

CSS最耗费性能的无疑是动画效果,其中包含border-radius(圆角) box-shadows(阴影) transparency(透明色) transforms(变形) filters(滤镜)动画效果的优化利用硬件能力.开启GPU加速利用translate3d实现动画位移.而非简单的top left等CSS选择器的问题首先css的解析是从右往左的,在我们编写代码时如果从子层...

2019-02-21 14:37:30 250

原创 echarts超出容器宽度和自适应的解决办法

在使用echarts时,为了兼容移动端.使用了flxe布局出现echarts超出父盒子宽度的问题可以看出来echarts溢出了父盒子一下问题相似https://segmentfault.com/q/1010000014963572https://segmentfault.com/q/1010000010939022在了解echarts绘制机制echarts图形只绘制...

2019-01-10 19:40:38 28568 11

原创操作URL封装

let util={}util.getUrlParams = function (){ let url = window.location.href; let str1 = url.indexOf('?'); let str2 = url.indexOf('#'); let paramsStr = ''; if(str1 !== -1){ ...

2018-12-21 12:04:56 402

原创 vue遇到的坑,DatePicker日期限制问题

1,iiview,DatePicker日期限制问题场景:开始日期小于结束日期.结束日期大于开始日期因为我是在Modal组件中写了这个内容效果如下:<DatePicker type="date" :options="endDate()" v-model.trim="modelData.contractEndTime" @on-change="mccOrder" &g...

2018-12-13 10:05:45 6373

原创 aixos和ajax使用post下载文件的处理

首先Ajax无法下载文件浏览器的GET(frame,a)和POST(from)请求具有如下特点response会交由浏览器处理 response内容可以为二进制文件,字符串等ajax请求特点response会交由Javascrip处理 response内容仅为字符串因此,ajax本身无法触发浏览器的下载功能在我和后台的交互中使用Web API中的Blob详解:https...

2018-12-04 10:05:00 294

原创 JS的精简与优化

代码精简必然带来可读性降低.斟酌使用有关&&和||的使用短路原理我们使用代码中经常会遇到控制语句条件调用精简在js逻辑运算中，0、""、null、false、undefined、NaN都会判为false if (i<=2) { ok() } //精简后 ...

2018-11-13 09:44:50 326

原创碎片.后期整理

苦于前端学习碎片化太严重.我准备在这里记录一下我的一些零碎的知识片段ps:主要是学过了就忘.方便以后回顾json 的标准语法:1.只能用双引号2.所有的key都必须用双引号包裹{"a":1,"b":2} √{a:1,b:2} ×前端可以不考虑JSON.stringify和JSON.parse 的应用场景利用url 传对象let json = {a...

2018-11-07 20:08:38 168

原创 javascript前端SEO优化总结

前端优化分为2个部分权重在下边将会分级1.head中优化<title> 标签的内容此优先级最高 10分<meta name=”keywords” content=” 关键字|关键字”> 0.1 分<meta name=”description” content=” 搜索内容简介”> 0.5分2.body中的优化h1-...

2018-10-30 20:24:49 1710

原创 lodash的学习之旅(已经废弃)

官方介绍 :是一个一致性、模块化、高性能的 JavaScript 实用工具库。它内部封装了诸多对字符串、数组、对象等常见数据类型的处理函数，其中部分是目前ECMAScript尚未制订的规范，但同时被业界所认可的辅助函数https://www.lodashjs.com/ 官方链接学习中ing...需要学习的概念节流延迟柯里化函数式编程链式调用? Iteratee ...

2018-08-08 17:48:15 213

原创 jade的使用

元素标签的语法 div a(href="",title="") 内容转译后: <div> <a href="" title="">内容</a> </div> 注意:把层级分

2018-08-08 16:59:07 240

原创一些自己封装的小方法

将一个数组中的某个数值全部往后移动但不改变前边的顺序 var arr= [false, 1, 0, 1, 0, 3, 0] var moveZeros = function (arr,number) { let k = 0 for(let i= 0;i<=arr.length;i++){ if (arr.inc...

2018-08-07 15:17:08 311

原创前端所需要安装的环境和vs code的常用插件

环境:npmgithub (代码管理工具视公司而定)vs code代码编辑器vue相关: webpacknode.jspostman调试工具php:phpstudy各类浏览器vscode插件(自己用什么装什么就好了)open in browser 打开浏览器用的必装Prettier - Code formatter代码格式化px...

2018-08-05 22:28:04 4936

原创 Git Bash的命令使用

git config --global user.name ** 配置用户名git config --global user.email **@**com 配置邮箱git add .全部加入到暂存区git add 加文件名提交单个文件git commit -m ''备注'' 提交本地git status 查看状态命令绿色的文字.表示当前有新文件添加但是未提交,红色状...

2018-07-22 09:25:20 167

原创 webpac的安装已经配置介绍(速成法)

在全局下安装：npm install webpack -g 安装指定版本：npm install webpack@版本号 -g 卸载:npm uninstall webpack -g查看版本号:webpack -v4.0以上webpack还要安装webpack-clinpm install webpack-cli -gpackage.json...

2018-07-20 10:15:14 1086

qq_42711864的博客