Question

我想动态创建面包屑菜单，但是遇到问题。

breadCrumbs() {
    return (
        <Breadcrumb>
            {this.state.breadCrumbs.map((element) =>(
                <Breadcrumb.Section key={uuidv1()} link>{element}</Breadcrumb.Section>
                <Breadcrumb.Divider />
            ))}
        </Breadcrumb>
    )
}

上面的代码不起作用，因为我需要将Breadcrum.Section和Breadcrumb.Divider包装在另一个元素中。我尝试使用div，但随后div堆叠在一起。如何使反应愉快并包装组件而不弄乱布局？

Answer 1

您可以在React中使用 Fragments 来对元素进行分组，而无需向DOM中添加额外的元素。

根据您的情况，您可以在不使用from PIL import Image import os path = os.path.dirname(os.path.realpath(__file__)) + '/' mask = Image.open(path + "snap_mask.png") mask = mask.convert("L") dst_im = Image.open(path + "snap.png") dst_im.putalpha(mask) white = Image.new('RGB', dst_im.size, (255, 255, 255)) white.paste(dst_im, dst_im) white.save(path + "snap_output.png")

的情况下将Section和Divider包裹成一个片段

<div>

ReactJS语义ui动态生成的面包屑菜单

1 个答案: