问题描述
我是前端开发的新手，我有一个react应用程序，想添加以前创建的一些旧的html代码。 （此html代码引用多个.js文件）。 我需要对我的React数据做几件事，然后在完成之后，用户可以选择部分结果，这将触发现有的html功能。
为此，尝试了以下操作：
componentDidMount () {
const script = document.createElement("script");
script.src = "/address/of/file.html";
script.async = true;
document.body.appendChild(script);
}
出现以下错误消息： “语法错误：意外令牌<” 。 （<是.html文件中使用的第一个字符）
我也尝试过重构代码本身，但是它长了数千行。
关于如何完成此操作的任何想法，还是只需要分别在每个JS文件中添加，以及react组件本身中的html位？
1楼
Saraband
1
2019-02-25 10:11:49
您可以将您的react应用程序包含在较早的html中，只需在需要的位置调用ReactDOM.render即可。
<body>
<!-- older html code -->
<div id='appRoot'></div>
</body>
ReactDOM.render(<App />, document.getElementById('appRoot'));
确保您的旧代码（尤其是js）不会干扰React，即DOM不会处理#appRoot任何#appRoot
2楼
Alex
0
2019-02-25 10:13:40
如果要使用外部脚本，则不能使用.html扩展名。 但是，您可以将.js文件与页面的javascript一起使用：
componentDidMount () {
const script = document.createElement("script");
script.src = "/address/of/file.js";
script.async = true;
document.body.appendChild(script);
}
您将可以在任意数量的页面上使用此js文件。
意外的标记“ <”来自您的.html页面的<!doctype html>