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开发者账号。

相关推荐

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

    2023-12-28 22:24:02       39 阅读
  2. Linux6.0、IO基础前置储备知识

    2023-12-28 22:24:02       46 阅读
  3. 关于react native文件路径的烦心事

    2023-12-28 22:24:02       12 阅读

最近更新

  1. TCP协议是安全的吗?

    2023-12-28 22:24:02       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2023-12-28 22:24:02       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2023-12-28 22:24:02       18 阅读
  4. 通过文章id递归查询所有评论(xml)

    2023-12-28 22:24:02       20 阅读

热门阅读

  1. 脚本批量导入导出es表结构

    2023-12-28 22:24:02       38 阅读
  2. List的四种遍历方法

    2023-12-28 22:24:02       36 阅读
  3. 面向-对象的三大原则

    2023-12-28 22:24:02       38 阅读
  4. vue中使用lodash的debounce防抖函数

    2023-12-28 22:24:02       38 阅读
  5. Qt开发Charts折线图绑定事件

    2023-12-28 22:24:02       42 阅读
  6. Vue前后端跨域链接

    2023-12-28 22:24:02       40 阅读
  7. vue前端学习笔记

    2023-12-28 22:24:02       43 阅读
  8. 数据库(部分函数)

    2023-12-28 22:24:02       35 阅读
  9. LeetCode 2660. 保龄球游戏的获胜者:模拟

    2023-12-28 22:24:02       36 阅读