Question

我在单独的模块“ project”和“ gallery”中有两个类。一类用于存储单个项目数据的对象，另一类用于存储所有项目的对象。

我试图将“ element”对象传递给“ gallery”对象，将其保存在构造函数中，然后使用in of方法传递给“ project”对象。

编辑2：我的代码是：

gallery.js：

import {project} from './project.js';


class gallery
{
constructor(selector)
{      
    this.projects = [];
    let parent = document.createElement("div");
    Object.assign(this, parent);
    this.parent = selector;

}

AddProject(name, imgsrc, desc, tags)
{
    const temp = new project(name,imgsrc,desc,tags);
    this.projects.push(temp);
}

PrintCallback(currentValue, index, arr)
{
    currentValue.PrintImage(this.parent);
}

PrintGallery()
{
    this.projects.forEach(this.PrintCallback);
}
}

document.addEventListener("DOMContentLoaded", function(event) {

let gallerySelector = document.querySelector("#portfolio-gallery");

const grafika = new gallery(gallerySelector);

grafika.AddProject("aaa","logo.png","qwerty",['aaa']);
grafika.AddProject("aaa","baner.png","aaa",['aaa']);
grafika.AddProject("aaa","kolo.png","aaa",['aaa']);
grafika.AddProject("aaa","plakietka.png","aaa",['aaa']);
grafika.AddProject("aaa","stark.png","aaa",['aaa']);
grafika.AddProject("aaa","targaryen.png","aaa",['aaa']);
grafika.AddProject("aaa","plakat.png","aaa",['aaa']);

grafika.PrintGallery();

});

project.js：

export class project
{
constructor(name,img,desc,tags)
{
    this.name = name;
    this.desc = desc;
    this.imgsrc = img;
    this.tags = tags;
}

CreateDiv(code,cssClass)
{
    const template = document.createElement("div");
    template.innerHTML = code;
    template.classList.add(cssClass);
    return template;
}

PrintDesc(selector)
{       
    let parent = document.createElement('div');
    parent = selector;

    const content = 
'<h1>'+this.name+'</h1>'+'<p>'+this.desc+'</p>'+'<h4>'+this.tags.join(", 
")+'</h4>'
    const content_div = this.CreateDiv(content,"project-content");

    parent.appendChild(content_div);

}

PrintImage(selector)
{    
    let parent = document.createElement('div');
    parent = selector;

    const img = '<img  src="grafika/'+this.imgsrc+'">';
    const img_div = this.CreateDiv(img,"project-img");
    img_div.classList.add("tile");

    parent.appendChild(img_div);

    $(parent).hide();
    $(parent).fadeIn(500);
}
};

将“元素”对象传递给类

0 个答案: