flex布局 一行显示两个同宽、高的盒子 并 可以换行

 

 小程序移动端项目，布局为每行两个元素，每列无限制

通过flex设置弹性布局

思路：

1. 父元素设置flex布局，宽度100% ，并允许换行

2. 子元素通过 min-width规定，最小宽度，这样盒子就不能一直弹性的缩小下去了，就会产生换行的效果，记得设置flex1

 
        
          {appFunction?.Shortcut001?.children?.map((item, index) => {
            return (
               1 && 'mt-sm'}`}
                onClick={() => handelToItem(item)}
                style={{
                /*// 我这里一行显示2个 所以是/2  一行显示几个就除以几*/
                 /*// 这里的62px = (分布个数2-1)*间隙62px, 可以根据实际的分布个数和间隙区调整*/
                  minWidth: 'calc((100% - 62px) / 2)',
                }}
              >
                
                  {item.functionTitle}
                  {item.functionDesc}
                  
                
              
            )
          })}