flex 最后一项margin无效？

flex 最后一项margin无效，导致原因设置了css如下

 display: flex;
  flex-direction: row;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;

简单粗暴解决，就是直接增加一个标签设置一个最小宽度就ok了，完整代码如下

<template>
  <div class="wrapper">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="item">3</div>
    <div class="item">4</div>
    <div class="item">5</div>
    <div class="item">6</div>
    <div class="right"></div>
  </div>
</template>
<style lang="less">
.wrapper{
  display: flex;
  flex-direction: row;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;

  .item{
    width: 200px;
  }

  .right{
    min-width: 10px;
  }
}
</style>