如何在ReactDOM.render中设置变量

Question

现在我有了Hello页面，我可以在界面上获得名称，但是如何将接口名称设置为ReactDOM.render？

ReactDOM.render(
<Hello/>,
document.querySelector('#root')
)

import React from 'react';
export interface HelloProps {
name?: string;
}
export class Hello extends React.Component<HelloProps> {
public render(): React.ReactNode {
const name = this.props.name ?? 'Mr. Unknown';
return (
<h1>Hello {name} in Electron!</h1>
);
}
}

Answer 1

以下内容应该有效：

ReactDOM.render(
<Hello name={'Kirby'}/>,
document.querySelector('#root')
)

请注意，您可以在那里传递一个变量而不是字符串，也可以将其更改为以下内容：

ReactDOM.render(
<Hello name="Kirby" />,
document.querySelector('#root')
)