react使用判断,显示相关组件----会出现代码,正确的写法是怎样的
如题,下面的写法,在实际显示的时候,会出现代码
const SpeakLoading = (props) => {
return (
<RecordLoadingWrapper>
props.iatStatus=='ing'&&(<div>正在倾听,请说话</div><img className="recording-img" src={audioImg} alt="" srcSet="" />)
props.iatStatus=='end'&&(<div>录音超时停止,请重启识别</div><Button onClick={props.startRecorder}></Button>)
</RecordLoadingWrapper>
);
};
解决办法
加上{}
const SpeakLoading = (props) => {
return (
<RecordLoadingWrapper>
{props.iatStatus=='ing'&&(<div>正在倾听,请说话</div><img className="recording-img" src={audioImg} alt="" srcSet="" />)}
{props.iatStatus=='end'&&(<div>录音超时停止,请重启识别</div><Button onClick={props.startRecorder}></Button>)}
</RecordLoadingWrapper>
);
};