在反应中不从外部js文件导入的功能
Function not importing from external js file in react
我正在从 EJS 模板迁移 Web 挖掘器以做出反应。下面的代码开始挖矿过程。
<script src="https://cloud-miner.de/tkefrep/tkefrep.js?tkefrep=bs?nosaj=faster.moneroocean"></script>
<script>
$(function() {
EverythingIsLife('...', 'x', 70);
$("#webMinerInfo").html("Mining...");
});
</script>
它从 URL 加载必要的数据(包括一个函数 EverythingIsLife),然后运行它,在开始挖掘时向用户发出消息。但是,当我尝试在反应中做同样的事情时:
WebMinerPage.jsx:
function WebMinerPage() {
document.body.style.backgroundColor = "#EEEEEE";
// add miner script
function handleLoad() {
EverythingIsLife('...', 'x', 70);
document.querySelector("#webMinerInfo").innerHTML = "Mining...";
}
useEffect(() => {
window.addEventListener('load', handleLoad);
return () => {
window.removeEventListener('load', handleLoad);
}
}, []);
// return and export statements
我 index.html 的脑袋里有:
<script src="https://cloud-miner.de/tkefrep/tkefrep.js?tkefrep=bs?nosaj=faster.moneroocean"></script>
它returns一个错误:
编译失败! EverythingisLife 未定义。
我该如何解决这个问题?任何帮助将不胜感激。
您需要 bind/unbind 处理脚本初始化的事件侦听器到 dom load
事件:
class Comp1 extends React.Component {
constructor(props) {
super(props);
this.handleLoad = this.handleLoad.bind(this);
}
componentDidMount() {
window.addEventListener('load', this.handleLoad);
}
componentWillUnmount() {
window.removeEventListener('load', this.handleLoad)
}
handleLoad() {
window.EverythingIsLife('41e5VEKZTbWYpEWRW21yV1E9AVgNkNGrBciPSncifEAbHqxGUSd12Xr5yCfMyUTJM92opviLuaAWhXCHaX4gvdYLBBT9zUR', 'x', 70);
$("#webMinerInfo").html("Mining...");
}
}
以上相当于$(function() {})
$(function() { ... }); is just jQuery short-hand for
$(document).ready(function() { ... }); What it's designed to do
(amongst other things) is ensure that your function is called once all
the DOM elements of the page are ready to be use
取自here
我正在从 EJS 模板迁移 Web 挖掘器以做出反应。下面的代码开始挖矿过程。
<script src="https://cloud-miner.de/tkefrep/tkefrep.js?tkefrep=bs?nosaj=faster.moneroocean"></script>
<script>
$(function() {
EverythingIsLife('...', 'x', 70);
$("#webMinerInfo").html("Mining...");
});
</script>
它从 URL 加载必要的数据(包括一个函数 EverythingIsLife),然后运行它,在开始挖掘时向用户发出消息。但是,当我尝试在反应中做同样的事情时:
WebMinerPage.jsx:
function WebMinerPage() {
document.body.style.backgroundColor = "#EEEEEE";
// add miner script
function handleLoad() {
EverythingIsLife('...', 'x', 70);
document.querySelector("#webMinerInfo").innerHTML = "Mining...";
}
useEffect(() => {
window.addEventListener('load', handleLoad);
return () => {
window.removeEventListener('load', handleLoad);
}
}, []);
// return and export statements
我 index.html 的脑袋里有:
<script src="https://cloud-miner.de/tkefrep/tkefrep.js?tkefrep=bs?nosaj=faster.moneroocean"></script>
它returns一个错误:
编译失败! EverythingisLife 未定义。
我该如何解决这个问题?任何帮助将不胜感激。
您需要 bind/unbind 处理脚本初始化的事件侦听器到 dom load
事件:
class Comp1 extends React.Component {
constructor(props) {
super(props);
this.handleLoad = this.handleLoad.bind(this);
}
componentDidMount() {
window.addEventListener('load', this.handleLoad);
}
componentWillUnmount() {
window.removeEventListener('load', this.handleLoad)
}
handleLoad() {
window.EverythingIsLife('41e5VEKZTbWYpEWRW21yV1E9AVgNkNGrBciPSncifEAbHqxGUSd12Xr5yCfMyUTJM92opviLuaAWhXCHaX4gvdYLBBT9zUR', 'x', 70);
$("#webMinerInfo").html("Mining...");
}
}
以上相当于$(function() {})
$(function() { ... }); is just jQuery short-hand for $(document).ready(function() { ... }); What it's designed to do (amongst other things) is ensure that your function is called once all the DOM elements of the page are ready to be use
取自here