Javascript 可以从React组件Prop调用类对象吗?
我正在学习ReactNative.Navigator.renderScene道具Javascript 可以从React组件Prop调用类对象吗?,javascript,reactjs,react-native,jsx,Javascript,Reactjs,React Native,Jsx,我正在学习ReactNative.Navigator.renderScene道具 'use strict'; import React,{Component} from 'react'; import ReactNative from 'react-native'; const { TouchableHighlight, Navigator, AppRegistry, Text, View, } = ReactNative; class TestClass extends
'use strict';
import React,{Component} from 'react';
import ReactNative from 'react-native';
const {
TouchableHighlight,
Navigator,
AppRegistry,
Text,
View,
} = ReactNative;
class TestClass extends Component{
render(){
return <Text>test</Text>
}
}
class MyTag extends Component{
render(){
return <Text>test</Text>
}
}
class Main extends Component{
render(){
const routes =[{component:TestClass,index:0},{component:MyTag,index:1}]
return(
<Navigator
initialRoute={routes[0]}
initialRouteStack={routes}
renderScene={(route, navigator) =>
<View><TouchableHighlight onPress={() => {
if (route.index === 0) {
navigator.push(routes[1]);
} else {
navigator.pop();
}
}}><View>{route.component}</View>
</TouchableHighlight></View>
}
/>
)
}
}
AppRegistry.registerComponent('ChoiceComponent', () => Main);
“严格使用”;
从“React”导入React,{Component};
从“react native”导入ReactNative;
常数{
触控高光,
领航员,
评估学,
文本,
看法
}=反应性;
类TestClass扩展组件{
render(){
回归试验
}
}
类MyTag扩展组件{
render(){
回归试验
}
}
类主扩展组件{
render(){
const routes=[{component:TestClass,索引:0},{component:MyTag,索引:1}]
返回(
{
如果(route.index==0){
navigator.push(路径[1]);
}否则{
navigator.pop();
}
}}>{route.component}
}
/>
)
}
}
AppRegistry.registerComponent('ChoiceComponent',()=>Main);
在JSX的renderScene props中使用{route.component}可以调用routes变量中的组件吗
如果将{route.component}更改为,则正确调用TestClass
您询问是否可以使用对象属性(
route.component
)代替类名。绝对地记住,这些只是标识符。您使用它的方式与使用类名的方式完全相同
所以不是
{route.component}
你想要
<route.component />
(但是继续阅读,我们可能需要做更多。)
例如:
类示例1扩展了React.Component{
render(){
返回{this.props.text};
}
}
类Example2扩展了React.Component{
render(){
返回{this.props.text};
}
}
常数路由=[
{组件:示例1},
{组件:示例2}
];
ReactDOM.render(
{routes.map(route=>)},
document.getElementById(“react”)
);代码>
成功了!!!我重新阅读了React官方文档,发现{}中包含的javascript对象是文本或函数,没有以我的方式使用。从现在起,我将使用大写标识符,如您所说。非常感谢@用户2255716:很高兴这有帮助。我不确定你所说的“我发现{}中包含的javascript对象是文本或函数,不是以我的方式使用的”是什么意思。表达式可以产生任何结果,它被使用。。。