D3.js d3可以'；不要创建引导卡

我希望d3在卡片列中创建卡片，但我的代码在刷新时只创建一张卡片。我犯了什么错

var group = d3.select('.card-columns').append("div").attr("class", "card")
    var card = group.selectAll('.card')
    group.data(data).enter()
        .merge(card)
        .html(function (d) {
            return
            `<div class="card-body">
                <h5 class="card-title">${d.project}</div>
                    <p class="card-text">${d.description}</div>
                        <p class="card-text"><small class="text-muted">${d.status}</small></p>
</div>`
        });

var group=d3.选择（'.card columns'）.append（“div”）.attr（“class”，“card”）
var card=组。选择全部（“.card”）
group.data（data）.enter（）
.合并（卡）
.html（函数（d）{
返回
`
${d.project}
${d.description}
${d.status}
`
});

您将

div

附加到

div

而不是附加到选择，请看我的示例：

let rnd=a=>Math.random（）.toString（36）子字符串（2）；
变量数据=[1,2,3,4]。映射（d=>({
项目：rnd（），
说明：rnd（），
状态：rnd（）
}));
d3.选择（“.card列”）
.选择全部（“.card”）
.数据（数据）
.输入（）
.append（“div”）//在此处追加div
.classed（“卡片”，真实）
.each（函数（d）{//我不知道为什么，但html函数没有帮助，我在这里所有节点上都使用了each
d3.选择（this）.html(
`
${d.project}
${d.description}
${d.status}
`)
});
.card{
边框：1px实心；
显示：内联块；
保证金：5px；
填充物：5px；
}