react
Mars-xq
好记性不如烂笔头。
展开
-
js中获取时间
demo 测试: var date = new Date(); function formatMonth(value) { return (value + 1) < 10 ? '0' + (value + 1) : (value + 1); } function format(value) { return (value) < 10 ? '0' + (value) : (value); } var loca原创 2020-10-21 14:51:25 · 37 阅读 · 0 评论 -
Promise.all、Promise.race/设置fetch请求的超时
参考:理解和使用Promise.all和Promise.race一、Pomise.all的使用Promise.all([promise1, promise2]) .then(所有都成功才回调success1, 只要有一个失败就回调第一个失败的fail1)等待全部执行完成:全部成功则按照组装顺序返回数组结果,只要有一个失败则返回失败结果Promise.all可以将多个Promise实例包装成一个新的Promise实例。同时,成功和失败的返回值是不同的,成功的时候返回的是一个【结果原创 2020-10-16 10:39:35 · 1452 阅读 · 0 评论 -
React Native 适配 iphone X XR XS
ptelad / react-native-iphone-x-helper react native中文网:SafeAreaViewimport {Dimensions, Platform, StatusBar} from 'react-native';export function isIphoneX() { const dimension = Dimensions.get('window'); return ( Platform.OS === 'ios' &am原创 2020-10-13 10:30:56 · 370 阅读 · 0 评论 -
react-navigation:onWillFocus/onDidFocus/onWillBlur/onDidBlur/componentWillUnmount等周期
参考:React Native之didFocus和didBlur代码:import React from 'react';import {View, Text, Button} from 'react-native';import {createAppContainer, NavigationEvents} from 'react-navigation';import {createStackNavigator} from 'react-navigation-stack';//didFocu原创 2020-09-05 17:46:02 · 1243 阅读 · 0 评论 -
React Native - Keyboard API使用详解(监听处理键盘事件)
参考:React Native - Keyboard API使用详解(监听处理键盘事件)当我们点击输入框时,手机的软键盘会自动弹出,以便用户进行输入。但有时我们想在键盘弹出时对页面布局做个调整,或者在程序中使用代码收起这个软键盘,这些借助 React Native 框架提供的 Keyboard API 就可以实现。一、Keyboard API 提供的方法Keyboard API 提供如下的静态函数供开发者使用。1,addListener(eventName, callback)(1)这个函数原创 2020-08-15 23:52:22 · 3802 阅读 · 0 评论 -
React Native中的 position 定位 及示例relative/absolute
参考:React Native中的postion定位一、概述在React Native中,flexbox定位和position定位可以同时使用,同时生效(关于flexbox定位的相关知识请自行查阅资料,这里不再赘述)。position有两个取值:relative(默认值)和absolute。二、relative——相对定位以元素本来的位置为基准进行偏移。示例:import React, {Component} from 'react';import { Platform,原创 2020-08-15 23:15:54 · 3989 阅读 · 0 评论 -
react-native 发送广播和接受事件通知DeviceEventEmitter
示例:A/B 组件间交互A: 发送B: 接收import React, {Component} from 'react';import {View, Button, TouchableOpacity, StyleSheet, DeviceEventEmitter, Text} from 'react-native';export default class Test extends React.Component { render() { return (原创 2020-08-03 22:02:53 · 239 阅读 · 0 评论 -
react native flex 弹性布局 : flex / flexGrow / flexShrink / flexBasis 对比
结论子view宽度之和 未 超过父view宽度,flex 等价于 flexGrow父view宽度:pWidth子view宽度:c1Width , c2Width , c3Width子view flexGrow:c1FlexGrow , c2FlexGrow , c3FlexGrow本demo中计算 flexGrow:1、【父布局剩余宽度】 = pWidth - (c1Width + c2Width + c3Width)2、child2 所占父布局剩余宽度 = 父布局剩余宽度 * c2Fl原创 2020-07-23 10:40:52 · 535 阅读 · 0 评论 -
react native:image resizeMode ,
Image组件必须在样式中声明图片的款和高。如果没有声明,则图片将不会被呈现在界面上。我们一般将Image定义的宽和高乘以当前运行环境的像素密度称为Image的实际宽高.当Image的实际宽、高与图片的实际宽、高不符时,视图片样式定义中resizeMode的取值不同而分为三种情况, 三个取值分别是: contain, cover和stretch.默认值是cover.cover模式只求在显示比例不失真的情况下填充整个显示区域。可以对图片进行放大或者缩小,超出显示区域的部分不显示, 也就是说,图片可能部原创 2020-07-08 21:17:59 · 655 阅读 · 0 评论