自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

suwu150

认真对待每一件事

原创 如何优雅的展示动态图标lottie-react-native
原力计划

项目中,需要使用到动态图标,发现又好用的库,在这里分享一下,需要使用的工具库为lottie-react-native,通过导出AE软件中的动画特效,以json文件的方式导出,来实现动画的效果。 一、Lottie是什么? Lottie是Airbnb开源的一个支持 Android、iOS 以及 Rea...

2020-04-04 11:24:41 381 0

原创 函数防抖和函数节流原理理解

防抖和节流有什么用,一般的使用场景,原理是什么 1.作用 使用函数节流与函数防抖的目的,就是为了节约计算机资源,提升用户体验。 2.场景 节流一般是用在必须执行这个动作,但是不能够执行太频繁的情况下,例如滚动条滚动时函数的处理,可以通过节流适当减少响应次数; 防抖一般是用来,用户输入有操作...

2020-04-25 21:45:57 74 0

原创 vue源码(六)-vue组件化机制

vue源码(六)-vue组件化机制 在注册一个组件的时候,我们始终需要给它一个名字。比如在全局注册的时候我们已经看到了: Vue.component('my-component-name', { /* ... */ }) 该组件名就是 Vue.component 的第一个参数...

2019-12-11 12:56:51 139 0

原创 vue源码(五)-vue虚拟dom和diff对比

vue源码(五)-vue虚拟dom 一、概念 虚拟DOM(Virtual DOM)是对DOM的JS抽象表示,它们是JS对象,能够描述DOM结构和关系。应用程序 的各种状态变化会作用于虚拟DOM,最终映射到DOM上。 二、优点 虚拟DOM轻量、快速:当它们发生变化时通过新旧虚拟DOM比对可以得到最小...

2019-12-10 16:41:26 118 0

原创 vue源码(四)-vue项目配置和入口文件,数据响应化处理

vue源码(四)-vue入口文件和项目配置,数据响应处理 一、获取vue项目代码 项目地址:https://github.com/vuejs/vue 迁出项目: git clone https://github.com/vuejs/vue.git 当前版本号:2.6.10 二、文件结构 如上所...

2019-12-02 18:17:34 245 0

原创 vue源码(三)-vue组件插件开发

vue源码(三)-vue组件插件开发 插件通常用来为 Vue 添加全局功能。插件的功能范围没有严格的限制——一般有下面几种: 添加全局方法或者属性。如: vue-custom-element 添加全局资源:指令/过滤器/过渡等。如 vue-touch 通过全局混入来添加一些组件选项。如...

2019-11-22 10:42:13 103 0

原创 vue源码(二)-vue组件通信方式

vue源码(二)-vue组件通信方式 一、组件化 组件化开发能够提高开发效率,方便重复使用简化调试步骤,提升项目的可维护性,便于多人系统开发 二、通信方式 1.父组件->子组件 ######1.1通过属性props进行传递 子组件进行定义一个字段msg接受父组件传递的参数 <templ...

2019-11-11 23:20:21 70 0

原创 vue源码(一)-搭建简单的vue项目

vue源码(一)-搭建简单的vue项目 一、下载vue 到官网直接下载开发版本vue:https://cn.vuejs.org/v2/guide/installation.html 下载完成后,会有一个vue.js文件 二、嵌入到网页 创建html文件,将下载好的vue.js文件嵌入到html中...

2019-11-10 12:17:46 264 0

原创 react-native树形结构选择组件

react-native-tree-select react-native-tree-select,树结构选择组件,通过层级展示数据,能够进行多选和单选,进行自定义节点样式等. = 项目结构 --components: treeSelect组件 --treeSelectExample: 组件演示...

2019-09-06 15:02:09 495 1

原创 解决 canvas 在高清屏中绘制模糊的问题

使用 canvas 绘制图片或者是文字在 Retina 屏中会非常模糊。如图: 因为 canvas 不是矢量图,而是像图片一样是位图模式的。高 dpi 显示设备意味着每平方英寸有更多的像素。也就是说二倍屏,浏览器就会以2个像素点的宽度来渲染一个像素,该 canvas 在 Retina 屏幕下相当...

2019-07-30 10:35:00 1456 0

原创 JavaScript键盘鼠标监听功能

实际应用中,我们会遇到监听按键输入和鼠标点击事件,在这里我们进行对鼠标和键盘事件的总结. #### Keyboard​Event KeyboardEvent 对象描述了键盘的交互方式。 每个事件都描述了一个按键(Each event describes a key);事件类型keydown, ke...

2019-06-11 10:31:20 819 0

原创 h5 Canvas转换为图片格式并下载

HTMLCanvasElement.toDataURL() 方法返回一个包含图片展示的 data URI 。可以使用 type 参数其类型,默认为 PNG 格式。图片的分辨率为96dpi。 如果画布的高度或宽度是0,那么会返回字符串“data:,”。 如果传...

2019-06-05 00:03:05 2694 0

原创 CSS自动换行、强制不换行、强制断行、超出显示省略号

CSS样式设置自动换行、强制不换行、强制断行、超出显示省略号 P标签是默认是自动换行的,因此设置好宽度之后,能够较好的实现效果,如下所示,当设置div宽度为固定值时,p中内容能够自动换行: 但是最近的项目中发现,使用ajax加载数据之后,p标签内的内容没有换行,导致布局错乱,于是尝试着使用换行样...

2019-05-31 00:20:08 10651 0

转载 m3u8格式视频源列表

平时,需要测试m3u8格式视频的播放,会使用一些可用的播放源,整理在这里: const sourceList = [ { name: 'cctv1', src: 'http://ivi.bupt.edu.cn/hls/cctv1hd.m3u...

2019-05-19 17:41:15 13605 0

原创 如何检测页面加载完成

document.readyState 1.定义 一个document 的 document.readyState 属性描述了文档的加载状态。 2.值 一个文档的 readyState 可以是以下值之一: loading / 加载 document 仍在加载。 interactive / ...

2019-04-16 22:19:17 174 0

原创 h5 Canvas正多边形绘制

在之前,我们使用线段进行绘制过矩形,使用arc,arcTo绘制过圆弧和圆形,但是Canvas还能够进行绘制其他图形,比如三角形、六边形、八边形等.这篇文章主要就是说明如何绘制多边形. &#10; See the Pen h5Polygon by suwu150&#10; (@s...

2019-03-23 14:18:16 679 0

原创 h5 Canvas圆弧与圆形的绘制

圆和圆弧是图形中基本图形之一.在Canvas中,CanvasRenderingContext2D对象提供了两个方法(arc()和arcTo())来绘制圆和圆弧。 JavaScript中弧度角度换算 仅难了解角度和弧度之间的关系是不够的,我们还需要知道怎么使用JavaScript来实现角度和弧度之间...

2019-02-27 21:57:00 723 0

原创 h5 Canvas线段的绘制

在Canvas中,线段也是路径中的一种,被称之为线性路径。在Canvas中绘制线性路径主要用到moveTo(x,y)、lineTo(x,y)和stroke()几个方法。 通常创建线条的方法是moveTo()和lineTo()方法,但是要使线性路径出现在canvas之中,我们必须使用上面提到的st...

2019-02-27 16:04:53 521 0

原创 h5 Canvas矩形的绘制

h5 Canvas矩形的绘制 1.绘制矩形api 在Canvas中提供了绘制矩形的API: fillRect(x, y, width, height):绘制一个填充的矩形 strokeRect(x, y, width, height):绘制一个矩形的边框 clearRect(x, y, width...

2019-02-26 16:05:43 1593 0

原创 h5 Canvas时钟制作

canvas可以说是html5中最强大的元素之一下面我们就使用canvas来进行绘制一个时钟 在绘制之前,我们需要知道需要绘制的元素都有哪些,其中包括钟最外边的圆圈、钟表上的数字、钟表上的指针,还有定时器 下面确定使用的html页面: 1.h5Clock.html &amp;amp;amp...

2019-02-25 12:47:44 321 0

转载 adb常用命令总结

ADB命令使用大全 ADB是什么 ADB的全称为Android Debug Bridge:android调试桥梁,下图为Android官方对adb的介绍: 可以看出,Android的初衷是用adb这样的一个工具来协助开发人员在开发android应用的过程中更快更好的调试apk,因此adb具有安...

2019-01-23 21:55:55 584 0

原创 React中createElement 和 cloneElement 的区别

createElement 和 cloneElement 有什么区别 createElement 和 cloneElement都能够生成可以直接在jsx页面组件中使用的标签语言,但是在生成的过程中是存在细微差别的 一、createElement 官网说明 1.语法格式 React.createEl...

2019-01-21 16:13:18 3556 1

原创 JavaScript闭包的自我修养

1.概述 闭包的定义很简单:如下代码函数 A 返回了一个函数 B,并且函数 B 中使用了函数 A 的变量,函数 B 就被称为闭包。 function A() { let a = 1 function B() { console.log(a) } return B } ...

2019-01-16 18:33:24 446 1

原创 JavaScript内存分配及垃圾回收机制

node垃圾回收机制 V8 实现了准确式 GC,GC 算法采用了分代式垃圾回收机制。因此,V8 将内存(堆)分为新生代和老生代两部分。 1.新生代算法 新生代中的对象一般存活时间较短,使用 Scavenge GC 算法(一种清理的执行机制)。 在新生代空间中,内存空间分为两部分,分别为 From ...

2019-01-16 15:42:15 295 0

原创 使用jarsigner进行apk签名

签名 签名是对要发布的apk文件作标记,确保你的apk文件有唯一的身份归属认证,只有相同签名和相同包名的文件才可以覆盖安装并保留用户信息。 签名apk jarsigner也存在于Java JDK的安装包当中,所以安装好了Java环境的话,可以直接在命令行使用。 重新签名命令 jarsigner -...

2019-01-15 17:33:46 1064 0

原创 'config.h' file not found'和/Libraries/WebSocket/libfishhook.a'-Xcode10,React-Native更新问题

1.React Native 中在xcode10运行提示 ‘config.h’ file not found 解决方法: 在项目终端执行以下命令 cd node_modules/react-native/third-party/glog-0.3.4 ../../scripts/ios-confi...

2019-01-06 20:10:56 412 0

原创 ios企业证书打包及发布ipa

在开发中,我们需要进行对app进行调试,下面有经常使用的打包方案 1.iOS 无证书真机调试流程 2.

2019-01-03 17:16:15 786 0

原创 2018年终总结,2019年年度计划

今天是2019年1月1日,新的一年开始了,在过去的一年里学习与规划有点杂乱,没有一个统一的计划,基本是在需要使用什么技术就去学习,而不会专门去钻研一项技术.效果不是很好. 2019年计划进行有规律地学习,主要涉及到以下三个方面: 一、学习android底层知识与实践技术 通过购买基本知识书籍和反向...

2019-01-01 14:23:07 2386 0

原创 使用Date对象中toDateString判断日期是否当天

var str = 1478508411000; console.log(new Date(str).toDateString()); if (new Date(str).toDateString() === new Date().toDateString()) { //今天 consol...

2018-11-18 17:20:06 1847 0

原创 React-Native- 状态栏组件(StatusBar)的使用详解

React Native - 状态栏组件(StatusBar)的使用详解 一、StatusBar组件介绍 StatusBar 是手机顶部的状态条。 StatusBar 是 React Native 0.20 起新增的跨平台组件,它可以用来设置并动态改变设备的状态栏显示特性。 Sta...

2018-11-01 00:06:53 7764 2

原创 duplicate entry: com/google/gson/FieldNamingPolicy$5.class

duplicate entry: com/google/gson/FieldNamingPolicy$5.class 1.问题说明 在使用gson中的时候,出现如下错误: Execution failed for task ‘:app:transformClassesWithJarMerging...

2018-10-28 17:01:30 982 0

原创 React-Native中非常贱的画虚线的方式

在使用react-native中的时候,使用css画曲线的时候,警告提示不支持,提示信息如下所示: 然后在网上淘了一番,结果发现这种写法,如下面所示: export const renderDotted = () =&amp;amp;amp;amp;amp;gt; { ...

2018-10-22 21:01:09 3692 2

原创 React-Native调用系统分享组件Share组件的使用

title: React-Native调用系统分享Share组件的使用 由于RN中的share组件不能满足项目中的需求 , 所以自己对系统分享功能做了一个封装 . 使用起来非常简单 如下所示,最简单的调用代码: &amp;amp;amp;amp;amp;lt;Touch...

2018-10-21 17:54:51 3834 4

原创 React-Navigation中withNavigation、withNavigationFocus高阶组件的使用

React-Navigation中withNavigation、withNavigationFocus高阶组件的使用 在2.18版本中的React-Navigation中有两个很实用的高阶组件,在这里我们进行说明一下: withNavigation withNavigation是一个高阶组件,它可...

2018-10-20 21:04:19 1495 0

原创 React-Native导航组件React-Navigation的详细介绍

https://blog.csdn.net/lu1024188315/article/details/73550028 1 先给出资料: 官网:StackNavigator 参考资料:react-native新导航组件react-navigation详解 有问题先去查查 issues。...

2018-10-20 18:16:35 1226 0

原创 前端中使用的特殊符号和字符

直接复制就好,我不知道怎么打出来,好像使用搜狗输入法或者一些其他的输入法能够打出这种字符 1.花边,꧁༺༻꧂

2018-09-29 16:56:04 2026 0

原创 谷歌浏览器自带网页截屏工具的使用

在平时,我们开发时,经常需要在网页中进行截图,那么,今天来看看谷歌浏览器的截屏工具,首先我们需要打开开发者模式,如下图: 打开开发者模式 然后,同时按"shift+command+p"按钮就能够打开工具弹窗,并且进行输入"cap",结果如下图所示: ...

2018-09-22 11:50:03 13003 0

转载 IOS 真机 dyld: Library not loaded 错误Crash

刚刚开始看IOS,编译一个现存项目,模拟器OK,真机 archive打包 crash.搜索了众多解决方案,百度上的太坑了,找不到适合我的,像说什么把 Targets -&amp;amp;amp;amp;amp;gt; Build Phases -&amp;amp;amp;amp;a...

2018-09-13 09:17:58 1695 0

翻译 React-Native中Keyboard模块

Keyboard组件是用来控制键盘的事件 用法 Keyboard 模块允许react代码能够进行监听本地的事件,也能够改变键盘的状态,比如能够dismissing键盘,如下代码所示 import React, { Component } from 'react';...

2018-08-19 18:37:50 720 0

原创 React-Native中事件监听DeviceEventEmitter

事件监听 页面 A import { DeviceEventEmitter } from ‘react-native’; componentDidMount() { //收到监听 this.listener = DeviceEventEmitter.addListener...

2018-08-12 00:00:44 6852 0

提示
确定要删除当前文章?
取消 删除