Я новичок в 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)
}
}
cost # getSubcategories ">