在setState上渲染新组件

Question

我有一个模拟时钟使用

https://github.com/zackargyle/react-analog-clock

我有一个文本框可在自动完成时获取城市名称和时区，>

• 默认时钟2加载了偏移量+8
• 在文本框中选择城市时
• 获取城市名称
• 获取时区
• 重新渲染时钟2

我该如何编码？

 public render(): React.ReactElement<Props> {
    return (
 <div className={styles.time}>
            <AnalogClock theme={Themes.light} width={120} gmtOffset=${this.state.gmtoffset} /><br/>
            {this.state.wxLoc}

 </div>
);
我尝试过

this.showClock2(this.state.gmtoffset);
////////////////////////

private showClock2(offset="+8"){
  let show=`<AnalogClock theme={Themes.light} width={120} gmtOffset=${offset} /><br/>
  {this.state.wxLoc}`;
  return show;

}
//other codes

public render(): React.ReactElement<Props> {
    return (
 <div className={styles.time}>
            {this.showClock2()}

 </div>
);

它显示文字代码，是否可以渲染<AnalogClock/>？

我有一个使用https://github.com/zackargyle/react-analog-clock的模拟时钟，我有一个文本框可在自动完成时获取城市名称和时区，默认时钟2的偏移量为+8，在选择时加载...

Answer 1

private showClock2(offset="+8") {

 ReactDOM.render(<AnalogClock theme={Themes.light} width={120} gmtOffset={offset} />, document.getElementById('root'))


}