React-Native 中组件、变量、方法的导入和导出

React-Native 中组件、变量、方法的导入和导出

一、组件

导出组件

export default class ConfirmDialog extends Component{
 render()
 {
 return(

 <View style={ConfirmDialogStyles.confirmCont}>
 <View style={ConfirmDialogStyles.dialogStyle}>
 <Text style={ConfirmDialogStyles.textPrompt}>
 {/*提示语*/}
 {this.props.promptToUser}
 </Text>

 <Text style={ConfirmDialogStyles.yesButton}
 numberOfLines={3} //控制3行,内容第一行显示回车，目的是让文本居中
 onPress={this.props.userConfirmed}
 >
 {'\r\n'} 确 定
 </Text>

 <Text style={ConfirmDialogStyles.cancelButton}
 numberOfLines={3}
 onPress={this.props.userCanceled}
 >
 {'\r\n'}取 消
 </Text>
 </View>
 </View>
 );
 }
}

使用export default关键字，来导出默认的组件。

导入组件

import ConfirmDialog from './ConfirmDialog';

二、变量和常量

导出

// 变量
export var name = 'ETT';
// 常量
export const age = 24

/*批量导出*/
export {name,age}

导入

使用 export default关键字，来导出默认的组件。
作者：秋名山车神
链接：https://www.jb51.cc/article/17917
来源：网
本文原创发布于网 ，转载请注明出处，谢谢合作

import {name,age} from "../values/ETTConfig";

三、方法

导出

export function sum(numa,numb){ return numa + numb; }

导入

import {sum} from './TestComponent'

总结

除了default默认导出的组件以外，其他的变量、常亮或方法，都需要使用大括号括起来导入。

使用的时候和原来在当前页面使用的方式相同。
如方法的使用依然是:
result = sum(1,2);
结果当然是3。

原文地址：https://www.jb51.cc/react/301764.html