如何解决通过外键创建一个对象而不属于另一个对象并分配它
我在创建项目并为其所属类别分配 ID 时遇到问题。抱歉下面的代码太长了,希望我能找到一些答案。
class Item {
constructor(attributes) {
let whitelist = ["id","name","quantity","color","details","category_id"]
whitelist.forEach(attr => this[attr] = attributes[attr])
}
static container(){
return this.c ||= document.querySelector("#itemsTable")
}
static all(){
return fetch("http://localhost:3000/items",{
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(itemArray => {
this.iCollection = itemArray.map(attrs => new Item(attrs))
let itemList = this.iCollection.map(item => item.render())
this.container().append(...itemList)
return this.iCollection
})
}
static findById(id) {
return this.collection.find(item => item.id == id);
}
static create(formData) {
return fetch("http://localhost:3000/items",{
method: 'POST',headers: {
"Accept": "application/json","Content-Type": "application/json"
},body: JSON.stringify({item: formData})
})
.then(res => {
if(res.ok) {
return res.json()
} else {
return res.text().then(error => Promise.reject(error))
}
})
.then(itemAttributes => {
let itemListed = new Item(itemAttributes);
this.iCollection.push(itemListed);
this.container().appendChild(itemListed.render());
new FlashMessage({type: 'success',message: 'New item added successfully'})
return itemListed;
})
.catch(error => {
new FlashMessage({type: 'error',message: error});
console.error(error)
})
}
render() {
this.element ||= document.createElement('tr');
this.element.classList.add(..."min-w-full divide-y divide-gray-200".split(" "));
this.nameTd ||= document.createElement('td');
this.nameTd.classList.add(..."px-6 py-3 text-left text-xs font-medium text-black-500 uppercase tracking-wider".split(" "));
this.nameTd.textContent = this.name;
this.quantityTd ||= document.createElement('td');
this.quantityTd.classList.add(..."px-6 py-3 text-left text-xs font-medium text-black-500 uppercase tracking-wider".split(" "));
this.quantityTd.textContent = this.quantity;
this.colorTd ||= document.createElement('td');
this.colorTd.classList.add(..."px-6 py-3 text-left text-xs font-medium text-black-500 uppercase tracking-wider".split(" "));
this.colorTd.textContent = this.color;
this.detailsTd ||= document.createElement('td');
this.detailsTd.classList.add(..."px-6 py-3 text-left text-xs font-medium text-black-500 uppercase tracking-wider".split(" "));
this.detailsTd.textContent = this.details;
this.element.append(this.nameTd,this.quantityTd,this.colorTd,this.detailsTd );
return this.element;
}
}
class FlashMessage {
constructor({type,message}){
this.message = message;
this.color = type == "error" ? 'bg-red-200' : 'bg-green-100'
}
static container(){
this.c ||= document.querySelector('#flash')
}
render(){
this.container().textContent = this.message;
this.container().classList.toggle(this.color);
this.container().classList.toggle('opacity-0');
}
}
这是我用于库存应用的项目类。这个类属于我后端的一个类别。如何在创建时将此类别 ID 分配给项目?我是初学者,我的学校项目审查将于下周到期。现在我正在将 id 硬代码传递到项目的 HTML 表单中。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。