antd vue select多选下拉同行显示，展示滚动条

做了个需求表格内使用了多选下拉，为了美观所以需要同行显示，antd文档上没看到对应的api，改了点css样式实现

<template>
  	<a-select mode="tags" style="width: 20%" :token-separators="[',']">
		<a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">{{ (i + 9).toString(36) + '很长很长很长' }}</a-select-option>
	</a-select>
</template>
<script>
export default {
  methods: {
    handleChange(value) {
      console.log(`selected ${value}`);
    },
  },
};
</script>
<style lang="scss" scoped>
// 让元素水平排列
/deep/.ant-select-selection--multiple .ant-select-selection__rendered {
	margin-left: 5px;
	margin-bottom: -3px;
	height: auto;
	max-height: 30px;
  max-width: 200px;
	overflow: auto;
	overflow-y: hidden;
}
/deep/.ant-select-selection--multiple .ant-select-selection__choice {
  overflow: initial;
}
// 调整内部样式
/deep/.ant-select ul,
.ant-select ol {
	display: flex;
}
/deep/.ant-select-selection--multiple > ul > li,
.ant-select-selection--multiple .ant-select-selection__rendered > ul > li {
	margin-top: 3px;
	height: 22px;
	line-height: 22px;
	font-size: 14px;
	width: auto;
  max-height: 200px;
}
/deep/.ant-select-search--inline .ant-select-search__field__wrap{
   max-width: 0px !important;
}
/deep/.ant-select-selection__rendered::-webkit-scrollbar {
	/*滚动条整体样式*/
	height: 5px;
}
/deep/.ant-select-selection__rendered::-webkit-scrollbar-thumb {
	/*滚动条里面小方块*/
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	background: lightskyblue;
}
/deep/.ant-select-selection__rendered::-webkit-scrollbar-track {
	/*滚动条里面轨道*/
	-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, .1);
	border-radius: 10px;
	background: #ededed;
}
</style>