我有以下类,我可以在php中包含另一个文件,如include()。
class A extends Component {
render() {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text>A</Text>
</View>
);
}
}
class B extends Component {
render() {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text>B</Text>
</View>
);
}
}
class C extends Component {
render() {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text>B</Text>
</View>
);
}
}
我必须在外部文件中包含View。我们可以通过导入将一个类包含到另一个类但是视图呢?
基本上,你有一个问题是关于导入文件。考虑三件事,
export
多个const or class
并导入它们与导入声明中的{}
。export default
关键字使用从文件导出const
或class
。导出默认值仅适用于一个文件。from
关键字
import ExportWithDefault, {ExportWithOutDefault} from './fileName.js'
参考文献:import,export, export default
让我们考虑组件A,B,C
文件comps.js
只导出为export
。喜欢
//file comp.js
import React,{Component} from 'react'
import {View, Text} from 'react-native'
export class A extends Component {
render() {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text>A</Text>
</View>
);
}
}
export class B extends Component {render(){return(B); }}
export class C extends Component {
render() {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text>C</Text>
</View>
);
}
}
现在考虑文件main.js
是您要导入A,B,C
并显示的文件。
import React, { Component} from 'react
import { View} from 'react-native
import {A,B,C} from './comp'; //considering both files in same directory
class Main extends Component {
render(){
return(
<View>
<A/>
<B/>
<C/>
</View>
)
}
}