有了这个index.html:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script data-main="main" src="require.js"></script>
</head>
<body>
<p>This is the body</p>
<canvas id="canvas1"></canvas>
</body>
</html>
还有这个main.js
console.log("main.js ran");
function render() {
console.log("render ran");
}
window.onload = render;
我希望控制台输出显示:
main.js ran
render ran
“ main.js ran”显示如预期,但未记录“ render ran”。渲染函数永远不会被调用。为什么不?
RequireJSdata-main
异步加载脚本。因此,在页面加载和main.js加载之间存在竞争条件。如果main.js首先完成加载,window.onload
将被设置,您将看到“ render ran”。如果页面首先完成加载,则不会。通常,这两种结果中的哪一种是不确定的,但是由于您给出的示例页面非常短,因此通常会在从服务器获取main.js之前完成加载。
如果您希望模块在页面加载后运行,则可以在domReady
模块上添加依赖项:
<script src="require.js"></script> <!-- note, no 'data-main' -->
<script>require( ['main'], function() {} );</script>
main.js:
define(['domReady!'], function() {
// ...
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句