vue的flex布局两边对齐

Vue中的flex布局可以使用justify-content属性来实现两边对齐。justify-content属性用于定义flex容器中子元素在主轴方向上的对齐方式。其中，justify-content: space-between;可以实现两端对齐的效果。具体实现方法可以参考以下代码：

<template>
  <div class="container">
    <div class="item">Item 1</div>
    <div class="item">Item 2</div>
    <div class="item">Item 3</div>
  </div>
</template>

<style>
.container {
  display: flex;
  justify-content: space-between;
}
.item {
  flex: 1;
}
</style>

在上述代码中，我们将容器设置为flex布局，并使用justify-content: space-between;实现两端对齐的效果。同时，我们将子元素的flex属性设置为1，使它们平均分配容器的剩余空间。这样，就可以实现两端对齐的效果了。