1. 基本语法
(1). 引入组件。(2). 继承共通。(3). 定义render函数。(4). 返回文本。(5). export导出
2. 自定义组件(引用)
将上面定义的"cat“组件引用到当前文件里
(1). inprot引入。(2). 使用
3. 自定义组件(参数定义与传参)
(1). 添加传参构造器。(2). 使用引数处理
(3). 调用时传参(指定属性名称=参数值)
4. 组件属性
state是类的全局属性,可以为其添加属性
5.事件与内置函数
控件的事件可以参照官方文档:TextInput · React Native 中文网
6. 自定义函数
(1). 定义自定义函数。(2). 通过事件调用自定义函数
7. 样式的定义
(1). 定义外部样式,创建外部样式文件 '../../utils/StyleSheet'
(2). 样式的引用
使用外部样式需要先导入:import styles from '../../utils/StyleSheet';
8. 页面跳转
前提1:实现 createStackNavigator 共通路由组件
前提2: 自定义路由组件
前提3:初期化路由组件(app.js)
实现页面跳转
this.props.navigation.navigate('Cat'); // 内置函数navigate是固定写法
(1). 前页面跳转,通过指定页面名称实现跳转
(2). 后页面返回
this.props.navigation.goBack(); // 固定写法,返回前一个页面
(3). 前页面跳转(传参)
this.props.navigation.navigate('Cat', {name: 'Cat1'});
(4). 后页面加载(接参)
let name = navigation.getParam("name");
(5). 后页面返回(传参)
this.props.navigation.state.params.callBack(params);
this.props.navigation.goBack();
(6). 前页面加载(接返回参数)
this.props.navigation.navigate(
'Cat' , {name: 'Cat1' ,
callBack:(params) =>{
Alert(params);
}
})
9. 表单提交
表单提交,用内置函数 fetch
具体参照:访问网络 · React Native 中文网
网络连接>访问网络
fetch('https://mywebsite.com/mydata.json');