import React from 'react';a0j易塔云建站-模板下载,web开发资源,技术博客
import { PhotoStory, VideoStory } from './stories';a0j易塔云建站-模板下载,web开发资源,技术博客
const components = {a0j易塔云建站-模板下载,web开发资源,技术博客
photo: PhotoStory,a0j易塔云建站-模板下载,web开发资源,技术博客
video: VideoStorya0j易塔云建站-模板下载,web开发资源,技术博客
};a0j易塔云建站-模板下载,web开发资源,技术博客
function Story(props) {a0j易塔云建站-模板下载,web开发资源,技术博客
// 错误 !JSX 类型不能是一个表达式。a0j易塔云建站-模板下载,web开发资源,技术博客
return <components[props.storyType] story={props.story} />;a0j易塔云建站-模板下载,web开发资源,技术博客
}
要解决这个问题, 需要首先将类型赋值给一个大写字母开头的变量:
import React from 'react';
import { PhotoStory, VideoStory } from './stories';
const components = {
photo: PhotoStory,
video: VideoStory
};
function Story(props) {
// 正确!JSX 类型可以是大写字母开头的变量。
const SpecificStory = components[props.storyType];
return <SpecificStory story={props.story} />;
}