vant 单选框在同一行显示

vant 单选框在同一行显示

利用

<van-radio-group v-model="item.score" direction="horizontal">
                <van-row>
                  <van-col span="20%">
                    <van-radio name="0" checked-color="#5cccfb">差</van-radio>
                  </van-col>
                  <van-col span="30%">
                    <van-radio name="40" checked-color="#5cccfb"
                      >一般</van-radio
                    >
                  </van-col>
                  <van-col span="30%">
                    <van-radio name="70" checked-color="#5cccfb"
                      >较好</van-radio
                    >
                  </van-col>
                  <van-col span="20%">
                    <van-radio name="100" checked-color="#5cccfb">好</van-radio>
                  </van-col>
                </van-row>
              </van-radio-group>

居中显示

<style lang='less' scoped>
.van-radio-group--horizontal {
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0 auto;
}
</style>