需要创建一个来自 fetch 的选项列表
need to create an list of options that comes from fecth
如何修复此代码以检索选项列表,我每次只能 select 一个。
static all(){
return fetch("http://localhost:3000/categories", {
headers:{
"Accept": "application/json",
"Content-Type": "application/json"
}
})
.then(res => {
if(res.ok){
return res.json()
} else{
return res.text().then(error => Promise.reject(error))
}
})
.then(categoryArray => {
this.collection = categoryArray.map(attrs => new Category(attrs))
let categoryList = this.collection.map(c => c.render())
this.container().append(...categoryList)
return this.collection
})
}
render() {
this.element ||= document.createElement('select');
this.element.class = "container";
this.nameOp ||= document.createElement('option');
this.nameOp.class = "container-category";
this.nameOp.textContent = `Category: ${this.title}`;
this.element.append(this.nameOp);
return this.element;
}
现在上面的代码正在为我拥有的每个类别创建一个 select 列表。
所以基本上只需要将实际标签添加到我的 HTML 并执行 getelementByid
render() {
this.element ||= document.getElementById('categories-Select');
this.element.classList.add(..."px-6 py-3 text-left text-xs font-medium text-black-500 uppercase tracking-wider bg-green-600".split(" "));
this.nameOp ||= document.createElement('option');
this.nameOp.class = "container-category selectCategoryid";
this.nameOp.textContent = `Category: ${this.title}`;
this.element.append(this.nameOp);
return this.element;
}
这允许我select来自获取请求的每个类别。
如何修复此代码以检索选项列表,我每次只能 select 一个。
static all(){
return fetch("http://localhost:3000/categories", {
headers:{
"Accept": "application/json",
"Content-Type": "application/json"
}
})
.then(res => {
if(res.ok){
return res.json()
} else{
return res.text().then(error => Promise.reject(error))
}
})
.then(categoryArray => {
this.collection = categoryArray.map(attrs => new Category(attrs))
let categoryList = this.collection.map(c => c.render())
this.container().append(...categoryList)
return this.collection
})
}
render() {
this.element ||= document.createElement('select');
this.element.class = "container";
this.nameOp ||= document.createElement('option');
this.nameOp.class = "container-category";
this.nameOp.textContent = `Category: ${this.title}`;
this.element.append(this.nameOp);
return this.element;
}
现在上面的代码正在为我拥有的每个类别创建一个 select 列表。
所以基本上只需要将实际标签添加到我的 HTML 并执行 getelementByid
render() {
this.element ||= document.getElementById('categories-Select');
this.element.classList.add(..."px-6 py-3 text-left text-xs font-medium text-black-500 uppercase tracking-wider bg-green-600".split(" "));
this.nameOp ||= document.createElement('option');
this.nameOp.class = "container-category selectCategoryid";
this.nameOp.textContent = `Category: ${this.title}`;
this.element.append(this.nameOp);
return this.element;
}
这允许我select来自获取请求的每个类别。