我是JavaScript的新手,可能正在尝试以此模拟Ruby。我使用StimulusJS,但我认为这个问题通常适用于JS。
我的目标是运行一种方法(单击按钮时),该方法将从按钮中获取并显示类别的所有子类别。该方法/函数将首先获取数据,然后操作DOM。我想将它们分为两个方法,但是当我从第一个方法(displaySubcategories
)中调用另一个方法(getSubcategories
)时,event
的值就会改变。与this
块中的fetch
相同-我需要先将其分配给self
,以便以后能够与对象本身相关。
有更好的方法吗?像所有方法都可以访问的变量(Ruby中的实例变量)一样?还是我根本不应该将它们分成两个函数(不是JS方式)?
import {Controller} from "stimulus"
export default class extends Controller {
static targets = ["categoryId", "categoryLabel", "subcategoryList", "subcategoryHeader"]
getSubcategories() {
let category_id = event.target.firstElementChild.value
let url = "/api/categories/" + category_id + "/subcategories?levels=1"
let self = this
let e = event
fetch(url)
.then(response => response.json())
.then(json_response => {
self.displaySubcategories(json_response, e)
})
}
displaySubcategories(json_response, event) {
subcategories.forEach(function (subcategory) {
let category_label_copy = this.cloneLabel(current_label, subcategory)
current_label.classList.add("chosen")
subcategory_list.appendChild(category_label_copy)
}, this)
}
}
expenses#getSubcategories“>