Flex align-items: center; 情况下, swiper控件宽度为0问题

微信小程序自带了一个container:

.container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
} 

设置了控件竖向显示,并居中显示, 此时其内部的swiper控件默认width变成了0, <text> 有内容(有固定宽度)的<view> 不存在问题

现在对前端还停留在学习阶段, 猜测设置了align-items: center; 后可能影响swiper默认宽度的测量, 后面知道了再补充

 解决方案

1.去掉align-items: center;  

2.显示设置swiper控件宽度