- 博客(1052)
- 资源 (44)
- 问答 (6)
- 收藏
- 关注
原创 Vue进阶(幺捌玖):Echarts 实现 Dialog 弹框动态显示 message
在利用Echarts实现地图展示时,需要实现点击某一省份,模态框形式给出相应的省份信息,点击模态框中的下钻按钮,实现下钻至该省份下的区域地图部分,以此类推,直至下钻至区县三级地图。
2021-08-01 09:20:04 2506
原创 Git进阶(十一):Git 常用操作汇总
概念,这是很通用的说法,其实工作区一般就是指我们能看到的文件、本地操作文件所在的目录,我们正常编写的代码文件、管理的资源文件都是在工作区里操作,这里的文件又细分为受版本控制的文件和不受版本控制的文件。命令的功能,通过用暂存区或者版本库中的文件覆盖本地文件的修改,以达到回退修改的目的,同时也可以使用版本库中的文件覆盖暂存区的文件,达到回退。:在每次提交的下面列出所有被修改过的文件、有多少文件被修改了以及被修改过的文件的哪些行被移除或是添加了。:它会显示每次提交所引入的差异。会用最近提交的版本覆盖掉它。...
2021-07-20 10:30:11 3439 8
原创 网站开发进阶(六十九)防抖节流
文章目录前言防抖 (debounce)节流 (throttle)总结拓展阅读前言防抖 (debounce)防抖,顾名思义,防止抖动,以免把一次事件误认为多次,敲键盘就是一个每天都会接触到的防抖操作。想要了解一个概念,必先了解概念所应用的场景。在 JS 这个世界中,有哪些防抖的场景呢?登录、发短信等按钮避免用户点击太快,以致于发送了多次请求,需要防抖;调整浏览器窗口大小时,resize 次数过于频繁,造成计算过多,此时需要一次到位,就用到了防抖;文本编辑器实时保存,当无任何更改操作
2021-07-18 17:44:49 1515 8
原创 Git进阶(十):Git 命令实现修改指定文件名称
文章目录一、前言二、为什么 git 默认不区分文件夹大小写?三、拓展阅读一、前言在当前项目中,早先创建并已经push到远程仓库的文件及文件夹,将名称大小写更改后,git无法检测出更改。由于git默认配置为忽略大小写,因此无法正确检测文件名个大小写的更改。可通过如下配置实现文件名大小写检查机制:git config core.ignorecase false为保证系统兼容性,不建议进行以上配置。可通过以下步骤实现文件名称修改:mv README.md README;git rm REA
2021-07-18 10:40:59 2625
原创 Git进阶(九):Git 命令实现提交指定文件
文章目录一、前言二、操作命令三、拓展阅读一、前言在项目开发过程中,经常会出现这样一种开发场景:本地部分代码还未写完,测试那边跑来告诉你要赶紧修复某个文件bug,情况紧急,待你改完后,提交代码的时候,发现自己还在开发阶段的某些代码不想提交,此时,可利用git指令帮助你实现提交指定文件!二、操作命令git status -s 查看仓库状态;git add src/components/文件名 添加需要提交的文件名(加路径–参考git status 打印的文件路径);git stash -u -
2021-07-18 10:04:45 3540
原创 Git进阶(八):git stash 与 git add
Git进阶(八):git stash和git add常用命令git stash 常用命令:git stash save “save message” : 执行存储时,添加备注,方便查找,只有 git stash 也可以,但查找时不方便识别。git stash list :查看 stash 了哪些存储。git stash show :显示做了哪些改动,默认 show 第一个存储,如果要显示其他存贮,后面加 stash@{$num},比如第二个 git stash show stash@{
2021-07-17 22:44:25 4654 6
原创 网站开发进阶(六十八)CSS3媒体查询@media
文章目录一、前言二、媒体查询语法三、应用示例四、浏览器兼容性一、前言媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成。媒体查询中可用于检测的媒体特性有:width、height和color(等)。使用媒体查询可以在不改变页面内容的情况下,为特性的一些输出设备定制显示效果。二、媒体查询语法CSS3中的媒体查询:根据浏览器窗口大小的改变,页面颜色就会改变。CSS3 语法@media mediatype and|not|only (media feature) { CSS-Code
2021-07-15 14:28:06 1172 6
原创 ReactNative进阶(四十五):渐变组件 react-native-linear-gradient
文章目录一、安装二、属性介绍2.1 colors2.2 start / end2.3 locations应用拓展阅读一、安装npm i react-native-linear-gradientreact-native link react-native-linear-gradient二、属性介绍2.1 colors默认情况下,渐变色的方向是从上向下的。<LinearGradient colors={['#63B8FF', '#1C86EE', '#0000EE',]} st
2021-07-14 13:53:57 3822 2
原创 npm进阶(一) npm i报错request to https://registry.npmjs.org/xxx failed, reason: connect ETIMEDOUT 104.16.2
由于node安装插件是从国外服务器下载,受网络限制影响大,速度慢且可能出现异常。所以,(阿里巴巴旗下业务阿里云)干了这事。来自官网介绍:这是一个完整npmjs.org镜像,你可以用此代替官方版本(只读),同步频 率目前为 10分钟 一次以保证尽量与官方服务同步。也就是说,我们可以使用阿里布置在国内的服务器来进行node安装。
2021-06-24 16:42:05 9104
原创 移动产品原型和线框图设计工具介绍
文章目录前言1. Proto.io2. Moqups3. UXPin4. Balsamiq Mockups5. JustinMind6. FluidUI7. Axure8. Mockflow9. Protoshare10. Wireframe11. WireframeSketcher12. Omnigraffle13. Pidoco14. FlairBuilder15. iPhone Mockup16. HotGloo17. InVision18. Mokk.me19. iPlotz20. Pencil
2021-06-24 15:48:23 1703
原创 Vue进阶(幺玖叁):$OPTIONS 讲解
文章目录前言拓展阅读前言vue实例属性$options是用来获取定义在data外的数据和方法。应用示例如下:<script>export default { name: "optionsTest", data() { return { }; }, //在data外面定义的属性和方法通过$options可以获取和调用 name: "CSDN", age: 12, testMethod() { console.log("shq5785"
2021-06-24 10:10:30 2400
原创 Vue进阶(幺玖贰):获取url传参
文章目录应用场景一:内部页面之间互相传值应用场景二:外系统跳转Vue项目时自带参数拓展阅读获取url参数有两种情况:应用场景一:内部页面之间互相传值假如要从A页面跳转到B页面,this.$router.push({name:"B",query:{ Id : this.tId , ...}})进入B页面之后,this.Id = this.$route.query.Id;就能将A页面的id传入B页面,进行参数获取。应用场景二:外系统跳转Vue项目时自带参数例如: htt
2021-06-23 17:34:20 1588
原创 ReactNative进阶(四十四):Mobile App 适配性优化
移动端应用开发过程中,内容自适应是避不开的一个注意点。相较于PC Web端开发应用设备的数量种类,Mobile APP面临着设备应用多样性问题,各厂商生产设备多样,同一厂商不同型号的电子设备分辨率、屏幕尺寸相异性是不得不考虑的一个问题,尤其是将手持设备,例如iPad等考虑在内,更加剧了设备适配性的思考。在RN实现移动应用开发过程中,通过链接跳转方式跳转至其他技术栈(例如)实现的应用情形中,适配性问题同样值得深思。
2021-06-23 17:14:50 1630 4
转载 React进阶(十三):Context
文章目录前言contextType拓展阅读前言Context 提供了一种方式,能够让数据在组件树中传递时不必一级一级的手动传递。一般情况下,数据在组件中,要一级一级的传递,单向数据流,比如Parent组件中的theme值,需要在Item组件中使用,就需要我们从Parent中向下传递, 但当我们有了Context后,我们就不需要一级一级传递了。Parent(theme=red) List(theme=red) Item(theme=red) ThemeCon
2021-06-09 10:56:09 1441
原创 React进阶(十二):HOOK
文章目录前言HOOK函数介绍State hook声明多个 state 变量Effect hook无需清除的 effect需要清除的 effectuseEffect 生命周期useEffect 的第二个参数Context hookHook 规则拓展阅读前言Hook 是 React 16.8.0 的新增特性,React Native 0.59及以上版本支持 Hook。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。请注意,要启用 Hook,所有 React 相关的
2021-06-09 10:11:58 1622 1
原创 ReactNative进阶(五):Mac 通过 .bash_profile 文件配置环境变量
,用于设置系统级的环境变量和启动程序,在这个文件下的配置信息会对所有用户生效。当用户登录(login)时,文件会被执行,并从。这个文件同样也可以用于配置环境变量和启动程序,但只针对单个用户有效。文件中添加环境变量,因为在这个文件中添加的设置会对所有用户起作用。也会在用户登录(login)时生效,也可以用于设置环境变量。,该文件是一个用户级的设置,可以理解为某一个用户的。只有单一用户有效,文件存储位于。(如果只是查看,直接使用。如文件不存在,则新建。目录的配置文件中查找。只会对当前用户生效。
2021-06-04 16:03:13 1976
原创 ReactNative进阶(四十二):面试必备:2023 ReactNative 经典面试题总结(含答案)
React PureComponent的原理当组件更新时,如果组件的 props 和 state 都没发生改变, render 方法就不会触发,省去 Virtual DOM 的生成和比对过程,达到提升性能的目的。具体就是 React 自动帮我们做了一层浅比较:if (this._compositeType === CompositeTypes.PureClass) { shouldUpdate = !shallowEqual(prevProps, nextProps) || !shallowEq
2021-06-02 16:55:13 7422 7
原创 ReactNative进阶(四十一):应用 FlatList 实现分组列表
功能简介属性说明方法集合简单应用示例高阶应用示例拓展阅读功能简介FlatList高性能的简单列表组件,支持下面这些常用的功能:完全跨平台。支持水平布局模式。行组件显示或隐藏时可配置回调事件。支持单独的头部组件。支持单独的尾部组件。支持自定义行间分隔线。支持下拉刷新。支持上拉加载。支持跳转到指定行(ScrollToIndex)。如果需要分组/类/区(section),请使用SectionList。FlatList和SectionList都是以VirtualizedList.
2021-06-01 20:26:42 1860
原创 ReactNative进阶(四十):应用 ListView 实现分组列表
前言ListView常用属性ListView高阶特性ListView使用Demo拓展阅读前言在前期博文中讲解了应用SectionList实现分组列表,本文主要讲解ReactNative长列表数据展示核心组件ListView ,该组件在数据量大时性能较差,占用内存持续增加,故诞生了FlatList组件。ListView常用属性ScrollView 相关属性样式全部继承属性名(类型)说明dataSource 【ListViewDataSource】设置ListView的数据源.
2021-06-01 19:31:48 1443
原创 ReactNative进阶(三十九):DeviceEventEmitter 实现发送和监听消息
移动端开发过程中,页面间信息传递是常见的应用场景。注册、发送消息方式如下:DeviceEventEmitter.emit('自定义名称',发送数据);消息监听方式如下:DeviceEventEmitter.addListener('名称',(events) ={使用数据events});例如,在A页面注册和发送消息:import {DeviceEventEmitter} from 'react-native';let param = {taobaoBind:false,walletSum:
2021-06-01 16:55:41 5526
原创 ReactNative进阶(三十八):Android ndk abiFilters 详解
一、前言二、ABI 是什么三、为何设置ndk的abiFilters四、如何配置 gardle五、ABI支持详解六、支持建议七、拓展阅读一、前言Android 系统本质是一个经过改造的 Linux 系统,so库是Linux系统上使用的共享库(类似windows上的dll)。最初,Android 系统只支持 ARMv5 的 CPU 构架,随着 Android 系统的发展,又加入了 ARMv7 (2010), x86 (2011), MIPS (2012), ARMv8, MIPS64 和 x86_64 .
2021-06-01 15:44:24 3381 4
原创 ReactNative进阶(三十七):应用 SectionList 实现分组列表
SectionList简述ReactNative长列表数据组件一共有三个:ListView 核心组件,数据量大时性能较差,占用内存持续增加,故诞生FlatList组件。FlatList 用于替代ListView,支持下拉刷新和上拉加载。SectionList 高性能的分组列表组件。其中,SectionList支持下面的常用功能:完全跨平台;支持水平布局模式;行组件显示或隐藏时可配置回调事件;支持单独的头部组件;支持单独的尾部组件;支持自定义行间分隔线;支持下拉刷新;支持上拉
2021-06-01 14:45:20 1678
原创 JavaScript进阶(二十四):ES8 中 async 与 await 使用方法详解
在前期博文中,针对异步编程,提出了Promise解决方案。从语法上说,Promise是一个对象,从它可以获取异步操作的消息,解决回调函数嵌套过多的情况。ES2017标准引入了async函数,使得异步操作变得更加方便。async是“异步”的简写,比如Ajax中就有这个,代表异步请求;因为await只能出现在async函数中的语法规定,await可以认为是async wait的简写。所以应该很好理解async用于声明一个function是异步的,而await用于等待一个异步方法执行完成。
2021-05-24 18:19:07 5375
原创 ReactNative进阶(三十五):应用脚手架 Yo 构建 RN 页面
在前期博文《ReactNative进阶(三十二):前端构建工具–Yeoman》中将脚手架yo安装成功,本篇博文主要讲解如何利用yo提供的代码自动生成功能生成项目代码。
2021-05-23 15:00:57 1704
原创 ReactNative进阶(三十四):npm Error: Cannot find module ‘are-we-there-yet‘ 解决措施
在安装脚手架工具Yaemon时,发现npm命令执行报错,错误信息如下:npm Error: Cannot find module 'are-we-there-yet'查询后发现是由于npm 损坏了,are-we-there-yet是npm下npmlog依赖的一个包。接下来就是一番折腾,参照如下步骤尝试去解决:cd /usr/local/lib/node_modulesmv npm /tmpsudo curl -L registry.npmjs.com/npm/-/npm-6.13.7.tgz |
2021-05-22 18:35:30 2391
原创 ReactNative进阶(三十三):Mac 下 homebrew 的安装和 brew 命令的使用
文章目录前言安装 brew 命令使用 brew 安装软件使用 brew cask 一站式安装brew 的更多用法废弃的用法拓展阅读前言Homebrew 是 mac 下的包管理器,基于命令行模式,使用命令 brew 管理软件。类似 ubuntu 下的 apt-get 、fedora 下的 yum。安装 brew 命令打开mac的终端软件,输入下面的内容,然后回车:/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebre
2021-05-21 19:32:54 1717 2
原创 ReactNative进阶(三十二):前端构建工具--Yeoman
就帮助我们新建立一个项目,而且项目已经填充了不少代码,我们可以沿着别人的已经搭建好的构架来编写业务即可,这对很多新手来说是非常好的一种提高方式,所以建议大家选star多的 —代码风格好,文件夹规划清晰,脚手架软件用于实现项目中多种不同的工具和接口的协同使用,优化项目的生成过程。的工作流,这个流是由一个强大的,固定的客户端组建,包含工具和框架帮助开发者快速建立强大的。为了降低项目的维护成本,将要求的组件结构和必要的使用说明生成组件模板,使用。工具来直接生成,当项目的体积越来越大时,就会体会到这种方式的好处。
2021-05-21 15:12:28 1458 8
原创 ReactNative进阶(三十一): IoC 框架 InversifyJS 解读
文章目录简介为什么要有 InversifyJS?目标安装应用示例步骤 1: 声明接口和类型步骤 2: 使用 @injectable 和 @inject 装饰器声明依赖步骤 3: 创建和配置容器步骤 4: 解析依赖拓展阅读简介InversifyJS ,一个强大又轻量的控制反转容器,提供给JavaScript 和 Node.js 应用使用,使用TypeScript编写。InversifyJS 是一个轻量的 (4KB) 控制反转容器 (IoC),可用于编写 TypeScript 和 JavaScript
2021-05-21 10:04:10 2158
原创 ReactNative进阶(三十):Component、PureComponent 解析
文章目录前言区别PureComponent缺点PureComponent优势前言React.PureComponent 与 React.Component 几乎完全相同,但 React.PureComponent 通过props和state的浅对比来实现 shouldComponentUpate()。在PureComponent中,如果包含比较复杂的数据结构,可能会因深层的数据不一致而产生错误的否定判断,导致界面得不到更新。如果定义了 shouldComponentUpdate(),无论组件是否是
2021-05-19 16:53:43 1804
原创 ReactNative进阶(二十九):BloC 模式
文章目录什么是BloC模式?拓展阅读什么是BloC模式?BloC【Business Logic Component】模式是paolo soares 和 cong hui 在2018年Google dartconf上提出的,具体的视频你可以参考YouTube.从视频中可以看到paolo soares用一个及其简单的例子阐述了传统写法的问题:业务逻辑和UI组件糅合在一起。不方便测试,不利于单独的测试业务逻辑部分。不能更好的重用业务逻辑代码,体现在,如果网络请求的逻辑有所变动的话,加
2021-05-18 10:16:24 2040
原创 JavaScript进阶(十八):ES6 Symbol 用法
Symbol是es6中一种新增的数据类型,它表示独一无二的值。es5把数据类型分为基本数据类型(字符串、数字、布尔、undefined、null)和引用数据类型(Object),es6中新增的Symbol数据类型划分到基本数据类型。为什么会有这样一种数据类型呢?//别人定义好的对象//你拿到对象想给这对象添加新的属性和方法的时候,可能会创建出一个name属性和showName方法这个时候,新增加的方法和属性就会去把原有的方法覆盖,这样就产生了冲突。
2021-05-18 09:59:27 1409 1
原创 ReactNative进阶(二十七):createMaterialTopTabNavigator 顶部导航组件
文章目录API原型参数说明RouteConfigstabBarOptions属性拓展阅读API原型createMaterialTopTabNavigator(RouteConfigs,TabNavigatorConfig)参数说明RouteConfigs路由名称到路由配置的一个映射。示例如下:{ Home:{ //这是一个首页路由配置项 screen:Home,//必填项 Home是react的一个组件 path:'',//选填项深度连接或webAPP中起作用 naviga
2021-05-18 09:29:36 1726
原创 ReactNative进阶(二十六):父子组件函数调用
需求在子组件执行某个操作的时候,需要其去调用父组件中的某个函数或者改变父组件中的某个参数。实现方式如下:子组件export default class Child extends PureComponent { static propTypes = { onItemClick: React.PropTypes.func, } info = '子组件的内容'; itemClick(index) { // 可以将子组件中的某个内容传出给父组件 if (this.
2021-05-17 18:28:00 1773
原创 ReactNative进阶(二十五):ScrollView 滚动视图组件详解
文章目录属性StyleScrollView 必须有一个确定的高度才能正常工作,因为它实际上所做的就是将一系列不确定高度的子组件装进一个确定高度的容器(通过滚动操作)。要给 ScrollView 一个确定高度的话,要么直接给它设置高度(不建议,要么确定所有的父容器都有确定的高度。一般来说我们会给 ScrollView 设置 flex: 1, 以使其自动填充父容器的空余空间,但前提条件是所有的父容器本身也设置了flex或者指定了高度,否则就会导致无法正常滚动,你可以使用元素查看器来查找具体哪一层高度不正确。
2021-05-13 09:32:34 4370 2
原创 ReactNative进阶(二十四):react-native-scrollable-tab-view 标签导航器组件详解
文章目录属性及方法介绍Demo属性及方法介绍renderTabBar(Function:ReactComponent)TabBar的样式,系统提供了两种默认的,分别是DefaultTabBar和ScrollableTabBar。注意:每个被包含的子视图需要使用tabLabel属性,表示对应Tab显示的文字。DefaultTabBar:Tab会平分在水平方向的空间。ScrollableTabBar:Tab可以超过屏幕范围,滚动可以显示。tabBarPosition(String,默认
2021-05-11 17:26:02 3883 5
原创 JavaScript进阶(三十):Javascript 严格模式详解
文章目录1. 概述2. 为什么用严格模式3. 进入标志4.如何调用4.1 针对单个脚本4.2针对单个函数5.语法与行为改变5.1 全局变量显式声明5.2 禁止this关键字指向全局对象5.3 禁止在函数内部遍历调用栈5.4 禁止删除变量5.5 对象不能有重名的属性5.5 函数不能有重名的参数5.6 显式报错5.7 禁止八进制表示法5.8 arguments对象的限制5.9 函数必须声明在顶层5.10 保留字拓展阅读1. 概述除了正常运行模式,ECMAscript 5添加了第二种运行模式:”严格模式”
2021-05-11 11:07:17 1219
原创 ReactNative进阶(二十二):点击事件.bind(this)引发的思考
文章目录前言React中bind方法的选择前言在React或React-native的点击事件中,会经常用到bind(this)。比如说一个简单的React-native点击组件:export default class AwesomeProject extends Component { constructor(props){ super(props); this.state = { } } handleClick () { console.log('
2021-05-11 10:15:49 1566 2
原创 ReactNative进阶(二十):Could not connect to development server
文章目录问题描述问题分析解决方法问题描述在RN Android开发过程中,测试机突然报如下错误信息:问题分析红屏给出的解决方案翻译过来如下:请按照以下的步骤来修复此问题:确保包服务器在运行确保你的设备或者模拟器连接着电脑,并且手机打开了USB调试模式,然后在cmd中运行adb devices来查看已经连接好的设备列表确保飞行模式是关闭的如果是使用真机来开发,输入 adb reverse tcp:8081 tcp:8081来检查设备解决方法1、首先检查包服务器是否运行正常。
2021-05-10 17:47:37 1508 2
原创 ReactNative进阶(十九):React Native 按钮 Touchable 系列组件使用详解
文章目录前言TouchableWithoutFeedback使用详解TouchableHighlight使用详解TouchableOpacity使用详解TouchableNativeFeedback使用详解前言在做RN App开发过程中离不了用户交互,在React Native中没有专门的按钮组件。为了让视图能够响应用户的点击事件,我们需要借助Touchablexxx组件,来包裹我们的视图。为什么说是Touchablexxx呢,因为它不只是一个组件,而是一组组件,以下四个组件都可以用来包裹视图来响应
2021-05-10 15:59:54 1954
Vue下textarea文本框根据内容自适应改变高度
2020-10-20
BackToTop.zip
2019-11-05
dubbo-admin-2.5.4 Web管理平台.zip
2018-04-29
dubbo-monitor-simple-2.5.3.zip
2018-04-29
w3c标准html5手册
2017-08-28
Chart.js实现饼状图添加文字
2017-08-28
Icon制作神奇-Greenfish Icon Editor3.31官方中文版
2017-04-25
iOS集成听云uni-app插件JS资源文件
2022-10-12
基调听云App移动应用性能管理产品采用SDK方式实现对App的**崩溃、卡顿、超时**等性能问题进行采集,并能对真实用户体验数据
2022-10-11
react-native实现ios横屏全屏展示
2024-03-13
react-native实现ios横屏全屏展示
2024-03-05
谁是第3w [face]monkey2:012.png[/face]
2021-03-24
学无止境[face]monkey2:005.png[/face]
2021-03-22
TA创建的收藏夹 TA关注的收藏夹
TA关注的人