如何像這樣重構 JS 代碼：
const fileInput = document.getElementById('input');
const p = document.querySelector('p');
fileInput.onchange = () => {
const selectedFiles = [...fileInput.files];
p.textContent = selectedFiles.map(s => s.size).join(', ');
}
讓它在鐵路的刺激中作業？我對 JS 的經驗很少，希望有一兩個在 Stimulus 控制器中實作 JS 代碼的示例，所以我有材料可以自己重構其他案例。非常感謝。
uj5u.com熱心網友回復：
一種可能的解決方案：
<div data-controller="file">
<input type="file" data-file-target="input" data-action="change->file#displayText" id="my-input">
<output data-file-target="text" for="my-input"></output>
</div>
// filename_controller.js
// Connects to data-controller="file"
export default class extends Controller {
static targets = ["input", "text"]
displayText() {
const selectedFiles = [...thisInputTarget.files];
this.textTarget.textContent = selectedFiles.map(s => s.size).join(', ');
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/482371.html
標籤：javascript 轨道上的红宝石 验证 重构 刺激
上一篇：如何將物件轉換為陣列？