React Native

一、序言 现在web开发最火的两个框架，react和vue。听起来就感觉很牛逼的样子。确实，不得不服，创造出这2种框架的人真的是牛逼。不过更牛逼的是为这2中框架不断完善的人。一个优秀的idea，会在很短的时间内被孵化、不断完善，这就是互联网的魅力。 好了，闲话不多说，我们进入正题。如果想看结论的，直接点击 这里 吆！ 二、react 、 vue 、 我 在讨论这两个框架之前，先和广大朋友们说清楚。本博客不掺杂太多的主观色彩，完全从个人工作中的使用情况和大家谈着2中框架。 先简略交代一下我对这两个框架的接触过程(可以直接跳过) 因为以前都是 angularjs 开发，所以，我第一个接触的是 vue 。数据绑定等众多相似之处，让我下意识的就选择了他。但是很可惜，那会网上资料不多，而且还是1.0版本，再加上工作中没有项目需要，我只是研究过一段时间的文档，并没有具体的项目开发。os：遗憾 后来，因为工作的需要，直接接触 react 做公司的OA系统。刚接触的时候，说实话， react 的 语法让你很难受，开发起来报错频繁，所以上手颇难，但是熟悉之后发现，react开发真的是好用，而且他的社区超级庞大，各种优秀的团队开发了很多现成的东西，为你的开发节省了大量时间。这里吐槽一下，80%的程序猿用代码，只有20%的程序猿在创造代码。不过这也是无奈之举，毕竟，作为一名员工第一职责是快、准

欢迎您开始 @medux 之旅，建议您依次阅读以下 4 篇文章，这将耗费您大约 30 分钟。 为什么你需要 @medux @medux 基础概念速览 @medux 路由篇 @medux 数据流 为什么你需要 @medux -- Github 地址 --- 一站式解决方案 通常一个前端工程包含如下职能： UI 渲染框架 状态管理 路由管理 模块化管理（包括模块的定义、加载、维护） 结构化管理（如何组织各类文件与资源） 其中 UI 框架与宿主平台密切相关，比较独立且复杂，通常有多种不同风格的解决方案可供选择。而除此之外其它职能相对简单，基本上都可以抽象为通用跨平台的 JS 运行时。 所以简单来说， @medux 想创建一个可以对接不同 第三方UI框架 的通用前端框架，它包含统一的 状态管理 、 路由管理 、 模块化管理 、 结构化管理 等职能，可以广泛运行于支持 JS 运行时的平台上，这正是时下热门的 跨平台跨端 前端工程解决方案。 加厚的状态管理层 也许你还在犹豫是不是需要独立的状态管理层，因为把状态管理写在 UI 渲染层里似乎也挺顺手。但是在@medux 看来，你不仅需要把它们从 UI 中分离出来，而且还要尽可能的剥离多一点，因为： 状态层往往更抽象与稳定，UI 层更复杂与多变，将稳定的东西剥离出来可以减少改动 剥离状态管理后的 UI 更纯粹： UI=Render(State)

官网react native中阴影的样式属性shadow都是只支持iOS不支持Android 目前有个方法，可以让Android有灰色的阴影，但是无法指定Android机上的阴影色值，只能是灰色的默认。 elevation:4 这个属性中的4是代表阴影的高度。且这个属性添加后，不会影响iOS机上的原本的彩色的阴影颜色，只是在Android机上显示的是默认的灰色的阴影。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 goods:{ marginTop:10, width:itemWidth, height:280, borderRadius:6, overflow: 'hidden' , marginLeft:12, backgroundColor: '#ffffff' , shadowOffset: {width: 0, height: 5}, shadowOpacity: 0.5, shadowRadius: 5, shadowColor: '#ddd' , //让安卓拥有灰色阴影 elevation: 4, } 　　最终效果 标签: react-native 点赞 收藏 分享 文章举报 卖火柴的小男孩2020 发布了372 篇原创文章 · 获赞 58 · 访问量 20万+ 私信 关注 来源： oschina 链接： https://my.oschina

【推荐阅读】微服务还能火多久？>>> https://blog.csdn.net/zhangatle/article/details/53289471 准备工作 注意：小米手机MIUI有坑，文末有解决方法 1 首先，你需要先安装Node.js并进行环境变量的配置，具体可以参考我的另一篇文章 nodejs在windows下的安装配置(使用NVM的方式) ，或者你也可以直接下载安装包进行安装，然后进行环境变量的配置工作，这里不再重复说明，不懂的可以参考其它教程；然后进行 Java Development Kit（JDK） 的安装和环境变量的配置，这里也不再介绍，这不是本文的重点，以上工作完成以后，下面正式开始！ 注意：由于众所周知的原因，国内一些网站被屏蔽,这里要想办法进行处理，你可以采用vpn的方式，这里我采用的是替换系统的hosts文件的方式， 这里一定要处理好，不然后面的步骤无法进行 到这里，基本的前期准备工作就完成了，下面正式开始 正式开始 安装Android Studio并配置Android虚拟机 1，下载 Android Studio 安装包，然后进行下面的步骤 2，双击安装包进行安装，点击进行下一步 3，勾选箭头的两处，一个是SDK的安装，一个是虚拟机的安装， 4，安装位置的选择，你可以选择一个位置，但是路径中最好不要出现中文，这里我采用默认路径 5

【今日推荐】：为什么一到面试就懵逼！>>> React Native 运行出现 Could not connect to development server 解决方法 参考文章： （1）React Native 运行出现 Could not connect to development server 解决方法 （2）https://www.cnblogs.com/iosapp/p/5301070.html 备忘一下。 点赞 收藏 分享 文章举报 wangchaoqi1985 发布了0 篇原创文章 · 获赞 184 · 访问量 171万+ 他的留言板 关注 来源： oschina 链接： https://my.oschina.net/u/4319831/blog/3233403

1、Lottie简介 Lottie是Airbnb开源的一个支持 Android、iOS 以及 ReactNative，利用json文件的方式快速实现动画效果的库 android库的地址： https://github.com/airbnb/lottie-android IOS库的地址： https://github.com/airbnb/lottie-ios 文档地址： http://airbnb.io/lottie/android/android.html#getting-started 这是一个特别棒的动画库，有完善的源码和演示demo 2、动画效果图 3、 lottie-android 的使用 3.1、gradle文件添加依赖，目前maven central 上最新版本是：2.6.1 dependencies { implementation 'com.airbnb.android:lottie:$lottieVersion' } 或者下载aar包 dependencies { implementation fileTree(include: ['*.jar'], dir: 'libs') implementation (name: 'lottie-release',ext:'aar') } 3.2、核心类 LottieAnimationView： 继承自 ImageView

本文会持续在OSChina码云上更新，最新版本请访问 https://gitee.com/goeasy-io/GoEasyDemo-IM-Chat 经常有朋友问起GoEasy如何实现IM，今天就手把手的带大家从头到尾用GoEasy实现一个完整IM聊天。 今日的前端技术发展可谓百家争鸣，为了确保本文能帮助到使用任何技术栈的前端工程师，Demo的源码实现上选择了最简单的HTML+JQuery的方式，所以,不论您是准备用Uniapp开发移动APP，还是准备写个小程序，不论你喜欢用React还是VUE，还是React-native或ionic, 或者您直接用原生Javascript和Typescript，都是可以轻松理解，全套代码开源在OSCHINA码云（ https://gitee.com/goeasy-io/GoEasyDemo-IM-Chat ）上了，下载后不需要搭建任何环境，直接用浏览器打开，就可以用来聊天了。 作为一名程序员，在编码之前，首先要做的当然是架构设计！什么？确认不是装逼？当然，别忘了星爷的那句话：我是一名程序员！没有思想的程序 员 ，跟咸鱼有什么区别呢？ 咳咳咳，正文开始： 首先我们代码层将整个功能分为四层： 华丽的展示层（index.html）：你们负责功能优雅强大，我负责貌美如花。展示层其实就是纯静态的html，显示界面，高端点说，就是负责人机交互的。

3 月，跳不动了？>>> 云栖号： https://yqh.aliyun.com 第一手的上云资讯，不同行业精选的上云企业案例库，基于众多成功案例萃取而成的最佳实践，助力您上云决策！ 在各个领域，Rust 都已经成为一流的语言。在 Discord，我们看到了 Rust 在客户端和服务端的成功。举例来说，我们在客户端使用它实现了 Go Live 的视频编码管道，在服务端，它则被用于 Elixir NIFs。最近，我们通过将服务的实现从 Go 切换到 Rust，极大地提升了该服务的性能。本文阐述了重新实现服务为何是有价值的、该过程是如何实现的以及由此带来的性能提升。 Read States 服务 Discord 是一家以产品为中心的公司，所以我们先介绍一下产品的背景信息。我们从 Go 切换到 Rust 的服务叫做“Read States”服务。它的唯一目的是跟踪用户阅读了哪些频道和信息。每当用户连接 Discord 的时候，每当消息发送的时候，每当消息被读取的时候，都会访问 Read States。简而言之，Read States 处于最关键的位置。我们希望能够保证 Discord 始终让人感觉快捷无比，所以必须要确保 Read States 是非常快速的。 在 Go 的实现中，Read States 无法支持产品的需求。在大多数情况下，它都是很快速的

3 月，跳不动了？>>> 在App包的构成中图片资源是比较占大小的，所以我们可以利用Iconfont来替代原来的png或者jpg单色图标，iconfont的优点是占Size小、支持任意大小不失真、支持任意颜色设置、平台化管理icon等等。 Demo及脚本地址 ： RNIconfont 【欢迎issue/star/follow~】 本文主要分为三部分： react-native-vector-icons库的集成与使用 如何使用任意自定义的iconfont 编写脚本来快捷生成iconfont映射文件 1.react-native-vector-icons库的集成与使用 react-native-vector-icons是ReactNative开发中十分好用的一个用来展示iconfont图标的库。 集成只要两步： 1.引入依赖 Run: npm install --save react-native-vector-icons 2.链接原生库 Run: react-native link react-native-vector-icons 如果第二步链接失败或者运行错误，可以自己手动链接，具体可以参考react-native-vector-icons说的比较清楚了。 集成完毕后，可以看到这个库默认引入了几个ttf文件（android项目在assets/fonts下）：

3 月，跳不动了？>>> 是使用react-navigation库的createStackNavigator创建导航时遇到。 按照正常流程安装，莫名其妙出现该问题。各种折腾，最后卸载react-native-gesture-handler组件，重新安装并link。卸载APP，重启工程，OK了。初步怀疑是库安装或者版本有问题。 卸载：npm uninstall react-native-gesture-handler --save 安装：npm install --save react-native-gesture-handler link：react-native link react-native-gesture-handler 来源： oschina 链接： https://my.oschina.net/u/585210/blog/3198072