1、为什么使用typeScript?

typeScript是JavaScript的超集

typeScript在编译期间就可以将错误抛出

增强代码的可阅读性和可维护性


2、案例的功能逻辑

切换职业

选择服务区域

选择服务品种

选择服务承诺


3、使用命令创建react Native的typescript

详情参考react Native中文官网https://reactnative.cn/docs/typescript#__docusaurus

react-native init MyAwesomeProject --template typescript

4、使用第三方库和声明文件

yarn add react-native-modal
yarn add react-native-vector-icons
yarn add --dev @types/react-native-vector-icons


5、使用样式

import {StyleSheet} from ''react-native;

const style = StyleSheet.create({
container:{
flexDirection:;'row';
}
})

6、使用图标

import Icon from "react-native-vector-icons/FontAwesome";

<Icon name='check' size={12}/>
react-native link react-native-vector-icons

PureComponent通过prop和state的浅比较来实现shouldComponentUpdate

react+Native使用typeScript的更多相关文章

  1. 使用Visual Studio Code和typescript 开发调试React Native项目

    关于React Native的详细介绍我就不叙述了,他是使用js构建原声app的开发框架.一次变异多平台运行,非常强大.但是个人不喜欢js的过于灵活(弱类型)的语法.强大的强类型语言Typescrip ...

  2. 使用TypeScript创建React Native

    ⒈初始化 React Native环境 参考https://reactnative.cn/docs/getting-started.html ⒉安装React Native官方的脚手架工具 npm i ...

  3. React Native相关

    安装相关工具参考(视频):http://ninghao.net/course/3001?a=26 学习参考:http://reactnative.cn/ 学习参考:http://www.ruanyif ...

  4. Hybrid App 和 React Native 开发那点事

    简介:Hybrid App(混合模式移动应用)开发是指介于Web-app.Native-App这两者之间的一种开发模式,兼具「Native App 良好用户交互体验的优势」和「Web App 跨平台开 ...

  5. [翻译]Review——24 tips for React Native you probably want to know

    Post author: Albert Gao Post link: http://www.albertgao.xyz/2018/05/30/24-tips-for-react-native-you- ...

  6. 用 React 编写移动应用 React Native

    转载:用 React 编写移动应用 React Native ReactNative 可以基于目前大热的开源JavaScript库React.js来开发iOS和Android原生App.而且React ...

  7. React Native工程中TSLint静态检查工具的探索之路

    建立的代码规范没人遵守,项目中遍地风格迥异的代码,你会不会抓狂? 通过测试用例的程序还会出现Bug,而原因仅仅是自己犯下的低级错误,你会不会抓狂? 某种代码写法存在问题导致崩溃时,只能全工程检查代码, ...

  8. React Native v0.4 发布,用 React 编写移动应用

    React Native v0.4 发布,自从 React Native 开源以来,包括超过 12.5k stars,1000 commits,500 issues,380 pull requests ...

  9. 我也开源... React Native Messager

    近期有空,玩转React Native. https://github.com/andyc365/ReactNativeMessager React Native Messager A React N ...

  10. Xamarin vs React Native vs Ionic vs NativeScript: Cross-platform Mobile Frameworks Comparison

    CONTENTS Reading time: 14 minutes Cross-platform mobile development has long been a viable alternati ...

随机推荐

  1. 读python代码-学到的python函数-1

    1.with open(data_path,'r') as f: with open()是python用来打开本地文件的,他会在使用完毕后,自动关闭文件,无需手动书写close(). 三种打开模式: ...

  2. Amber22 安装过程miniconda报错处理

    最近在安装amber22时,使用其官方说明安装,但在安装miniconda这一步出错,致使amber22安装不成功! 报错如下: CondaFileIOError: '/home/lbm/amber2 ...

  3. 道长的算法笔记:Trie字典树

    Trie模板 Trie 是一种用于实现字典序快速检索的多叉树结构,Trie 每个节点都有若干的字符指针,若在扫扫描字符串时扫到字符 \(c\),则沿着当前节点 \(c\) 字符指针走向该指针指向的节点 ...

  4. C组合方案

    递归实现组合型枚举 从 1∼n 这 n 个整数中随机选出 m 个,输出所有可能的选择方案. 输入格式 两个整数 n,m ,在同一行用空格隔开. 输出格式 按照从小到大的顺序输出所有方案,每行 1 个. ...

  5. 算法学习笔记(3): 倍增与ST算法

    倍增 目录 倍增 查找 洛谷P2249 重点 变式练习 快速幂 ST表 扩展 - 运算 扩展 - 区间 变式答案 倍增,字面意思即"成倍增长" 他与二分十分类似,都是基于" ...

  6. DOM的操作(增删改查)

    操作DOM的核心就是增删改查 目录 一.节点创建型API 1.1 createElement 1.2 createTextNode 1.3 cloneNode 1.4 createDocumentFr ...

  7. Unreal学习笔记2-绘制简单三角形

    目录 1. 概述 2. 详论 2.1. 代码实现 2.2. 解析:Component 2.3. 解析:材质 2.4. 解析:包围盒 2.5. 解析:Section 3. 其他 4. 参考 1. 概述 ...

  8. Windows离线安装.net Framework3.5

    写在前面 本文主要介绍在Windows离线情况下安装.NETFramework3.5运行环境 使用场景 在日常开发C#程序中,经常会遇到开发过程中无任何问题,但是安装到目标电脑是会无法打开的,如下图 ...

  9. 使用 shell 脚本拼接 srt 字幕文件 (srtcat)

    背景 前段时间迷上了做 B 站视频,主要是摩托车方面的知识分享.做的也比较粗糙,就是几张图片配上语音和字幕进行解说.尝试过自己解说,发现录制视频对节奏的要求还是比较高的,这里面水太深把握不住.好在以 ...

  10. redis georadius源码分析与性能优化

    原文地址: https://blog.fanscore.cn/a/51/ 背景 最近接到一个需求,开发中使用了redis georadius命令取附近给定距离内的点.完工后对服务进行压测后发现geor ...