flex布局纵向换行后，设置父元素的宽度为换行后的宽度

在 Flexbox 布局中，如果希望父元素的宽度能够自适应纵向换行后的宽度，可以使用 JavaScript 来动态计算并设置父元素的宽度。

首先，在父元素的样式中，需要添加 `flex-wrap: wrap`，以允许子元素进行纵向换行。然后，在父元素的 JavaScript 代码中，可以通过遍历子元素来获取每行元素的宽度，并取其中的最大值作为该行的宽度。最后，将所有行的宽度相加即可得到父元素的最终宽度。代码如下：

const parent = document.querySelector('.parent');
const children = parent.children;
const parentPadding = parseInt(getComputedStyle(parent).paddingLeft) + parseInt(getComputedStyle(parent).paddingRight);
let rowWidth = 0;
let rowMaxWidth = 0;
let parentWidth = 0;

for (let i = 0; i < children.length; i++) {
  const child = children[i];
  const childWidth = child.offsetWidth;
  if (rowWidth + childWidth > parent.offsetWidth - parentPadding) {
    // 换行了，将当前行的宽度加入父元素的宽度
    parentWidth += rowMaxWidth;
    rowWidth = childWidth;
    rowMaxWidth = childWidth;
  } else {
    rowWidth += childWidth;
    if (childWidth > rowMaxWidth) {
      rowMaxWidth = childWidth;
    }
  }
}

// 处理最后一行的宽度
if (rowWidth > 0) {
  parentWidth += rowMaxWidth;
}

// 设置父元素的宽度
parent.style.width = parentWidth + 'px';

上面的代码中，首先获取了父元素和子元素的引用，以及父元素的内边距。然后遍历子元素，累加它们的宽度并判断是否换行。当换行时，将当前行的宽度加入父元素的宽度，并重新计算下一行的宽度。需要注意的是，在计算行宽度时，需要减去父元素的内边距。最后，将所有行的宽度相加即可得到父元素的最终宽度，并将其设置为父元素的宽度即可。

希望这个回答对您有所帮助！