为什么所有反应组件都会改变高度而不是一个答案

【问题标题】：Why all react components changes height instead of one为什么所有反应组件都会改变高度而不是一个
【发布时间】：2021-03-25 18:19:12
【问题描述】：

我正在制作一个 Trello 副本，并且我已经渲染了几次组件，并且我在组件末尾有一个按钮，它应该改变状态并用另一个按钮显示输入字段，看起来像这样：before click

但问题是，当我单击“添加另一个项目”时，所有组件的高度都会发生变化，如下所示： after click

但它应该只针对一个，有什么想法吗？

容器的CSS代码：

  listCointainer: {
   display: 'flex',
   justifyContent: 'flex-start',
  },

对于列表：

list: {
        minWidth: '300px',
        backgroundColor: '#EBECF0',
        margin: '10px',
        paddingBottom: '10px',
    },

【问题讨论】：

标签： reactjs flexbox components

【解决方案1】：

使用

list: {
        minWidth: '300px',
        backgroundColor: '#EBECF0',
        margin: '10px',
        paddingBottom: '10px', 
        height: 'fit-content'
    }

【讨论】：

谢谢，这个问题解决了！顺便提一下，它应该是 fit-content 而不是 fitContent。