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.imooc.com/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。