编辑2:我很好奇是否是弹性框破坏了这段代码?Dragula 是否设计用于与柔性容器一起使用?
我有以下容器:
#myDisplay{
display: flex;
justify-content:left;
overflow:none;
flex-wrap: wrap;
flex-grow: 0;
position:absolute;
top: 2.68518519%;
left:9.96767241%;
width: 90.03232759%;
height:97.31481481%;
Run Code Online (Sandbox Code Playgroud)
我使用 React 在该容器中添加 3 行,每行 7 个项目:
#myCard{
color:var(--txtcolor);
flex-shrink: 0;
width:12.44763614549592%;
height: 31.29381571%;
background: var(--contentbg);
border: 3px solid var(--drkblue);
box-sizing: border-box;
border-radius: 53px;
margin-right: 1.7658573%;
padding-left: 1%;
padding-right:1%;
font-size: 0.875rem;
Run Code Online (Sandbox Code Playgroud)
我正在使用以下拖拉古拉代码:
const dragulaDecorator = (componentBackingInstance) => {
if (componentBackingInstance) {
let options = { };
Dragula([componentBackingInstance], options);
}
};
Run Code Online (Sandbox Code Playgroud)
并像这样声明我的显示框:
<div id="myDisplay" ref={dragulaDecorator}>
{renderCard(1)}
{renderCard(2)}
{renderCard(3)}
{renderCard(4)}
{renderCard(5)}
{renderCard(6)} …Run Code Online (Sandbox Code Playgroud)