这个 package.json 文件依赖
"dependencies": {
"@rails/webpacker": "5.4.3",
"backbone": "^1.4.0",
"jquery": "^3.6.0",
"webpack": "^4.46.0",
"webpack-cli": "^3.3.12"
},
"devDependencies": {
已经在 application.js 中导入了 Backbone
// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
import './index.css'
import jQuery from "jquery";
window.jQuery = jQuery;
window.$ = jQuery;
window.Backbone = require("backbone");
window._ = require("underscore");
var AppView = Backbone.View.extend({
el: "body",
events: {
"click #box": "click"
},
initialize() {
alert('init')
},
click(e) {
alert('click')
},
})
var appView = new AppView()
在 html 中点击没有作用
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= stylesheet_pack_tag "application", "data-turbo-track": "reload" %>
<%= javascript_pack_tag "application", defer: false %>
</head>
<body>
<div id="box">
box
</div>
<%= yield %>
</body>
</html>
Rei
#1
2022年01月20日
javascript 执行的时候 body 还没解析。
简单的解决方法，可以把 js defer 设 ture，把 js 延后到文档解析完成后执行。
<%= javascript_pack_tag "application", defer: true %>
