如何在Reactjs中集成javascript代码

Question

我在Reactjs工作，并使用Nextjs，我试图整合"index.html"来index.js"，在index.html"我有以下javascript代码，我想知道这段代码应该移动到哪个文件中?

<script language = "text/Javascript"> 
cleared[0] = cleared[1] = cleared[2] = 0; //set a cleared flag for each field
function clearField(t){                   //declaring the array outside of the
if(! cleared[t.id]){                      // function makes it static and global
cleared[t.id] = 1;  // you could use true and false, but that's more typing
t.value='';         // with more chance of typos
t.style.color='#fff';
}
}
</script>

Answer 1

你的react代码将存在于一些全局上下文中;在浏览器中，通常是window。

如果你给这个上下文分配了一些东西，就像你对clearField函数所做的那样，那么它应该对React可用。

希望你能看到这个例子。Inindex.html:

<script>
function getTheThing() {
return "This is the thing";
}
</script>

Inapp.js:

export default function App() {
const thing = window.getTheThing();
return (
<div className="App">
<h1>Hello CodeSandbox</h1>
<h2>Start editing to see some magic happen!</h2>
{thing}
</div>
);
}

在渲染的输出中，thing被渲染为index/html

中定义的getTheThing

的结果。这个可以有很多变化，所以在不知道确切情况的情况下，很难说