React-Native项目 — 关于IOS知识储备

系列文章目录

1. React-Native环境搭建（IOS）
2. React-Native项目 — 关于IOS知识储备

前言

React-Native项目开发，其实并不是仅仅知道前端的知识，就能把App做好，在某些场景中，我们不得不了解一部分 Ios 相关的知识，比如 Js 与 Native 交互场景，又比如Ios集成微信、支付宝等第三方功能时，我们不得不对react-native项目进行改造。

想要实现这些目标，个人觉得就需要提前了解一些 Ios 的基本知识，比如 Cocoapods、比如 object-c 语法、比如Xcode编辑器等等。

一、Podfile 文件认知

Podfile 是 ios 开发，描述项目依赖规则的一个描述性文件。

Podfile文件，类似前端的 package.json 文件，记录了该项目，依赖那些三方库。

1，Podfile vs package.json

了解Podfile，就不得不了解，CocoaPods，其官网地址：https://guides.cocoapods.org/using/getting-started.html

那CocoaPods是什么呢？你可以把它理解为一个包管理器，就像node中有很多的前端需要的包一样。

Podfile的初始化生成，一般可以通过 pod init 命令。就像package.json文件的生成，直接通过 npm init 一样。

理解package.json文件，有助于我们理解前端项目，让我们能够了解前端项目的启动命令，依赖三方库等等。

那理解Podfile文件，有助于我们理解IOS项目，让我们能够了解IOS项目开发的基础依赖库，项目编译打包规则等等。

2，Podfile配置示例

个人认为，作为 React-Native开发者，主要了解Podfile中的target 以及 pod关键字，一个简单的配置教程示例如下：

# 全局配置，
install! 'cocoapods',
         :deterministic_uuids => true, # 创建Pods项目时，是否生成确定的UUID。默认值：true
         :integrate_targets => true # 是否把已经安装好的Pods集成到用户的项目中。默认值：true
# 平台申明、版本
platform :ios, '9.0'
# 针对引入库的所有警告，都忽视掉
inhibit_all_warnings!

# 针对MyApp这个target，引入ObjectiveSugar
target 'MyApp' do
    pod 'ObjectiveSugar', '~> 0.5'

    # 针对MyAppTests这个target，继承了MyApp的ObjectiveSugar，以及自己引入了OCMock
    target 'MyAppTests' do
        # 继承模式(search_paths、complate、none)
        inherit! :search_paths
        pod 'OCMock', '~> 2.0.1'
    end
end
# 每一个target申明完成之后，都以end结束。

# Podfile中的hooks（pre_install、pre_integrate、post_install、post_integrate）
post_install do |installer|
    installer.pods_project.targets.each do |target|
        puts "#{target.name}"
    end
end

二、简单的IOS语法知识

React-Native项目中，IOS代码部分，主要是使用object-c语法，语法的表现上，代码块就分为两部分，一部分是申明文件，一部分是实现文件。申明文件是以 .h 为结尾的文件，实现文件是以 .m 为结尾的文件。

了解ios语法的业务目的，我觉得有两个：
1，实现react-native 中，js与ios之间的通信。
2，针对第三方能力的对接。例如：微信开放平台能力，支付宝支付能力等等。

1，react-native中的文件说明

a，AppDelegate.h文件

#import <RCTAppDelegate.h>
#import <UIKit/UIKit.h>
#import <WXApi.h>

@interface AppDelegate : RCTAppDelegate<WXApiDelegate>

@end

首先，关于 .h 文件，它是一个申明文件，在AppDelegate中，import 关键字，是用于引入第三方库的，我们可以看到，在这里主要引入了三个库：RCTAppDelegate、UIKit、WXApi

• RCTAppDelegate，是react-native中，为了实现同ios的交互、通知等功能，而实现的一个类。
• UIKit，是基于ios的一个页面视图框架。
• WXApi，微信sdk中，对于微信分享、支付等一系列功能的封装。

interface关键字，用于申明一个接口 - AppDelegate。

b，AppDelegate.m文件

#import "AppDelegate.h"
#import <React/RCTBundleURLProvider.h>

@implementation AppDelegate

@end

关于 .h 文件，是对某个类的实现文件，所以必须引入其头文件 AppDelegate.h。

implementation关键字，就是说明，该文件需要对头文件中的定义，就行实现。

三、其他关键知识

react-native开发，ios部分的编译，其实还是依靠xcode编辑器，而且在某些集成第三方库的时候，也离不开xcode。针对xcode，我们必须了解微信sdk如何在xcode中配置。xcode 如何引用第三方库等等。

ios项目的开发，离不开Apple开发者账号，因为我们的app，总要发布到App store中，想要发布到appstore，就必须有Apple开发者账号。