vue 带箭头下拉框

css 代码
.droplist-content {
display: flex;
flex-direction: column;
font-size: 0.12rem;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #6D89AF;
line-height: 0.32rem;
position: absolute;
top: 0.68rem;
background-color: white;
left: 0.8rem;
border: 1px solid #F0F0F0;
/*overflow: scroll;*/
width: 2.65rem;
height: 0.98rem;
background: #FFFFFF;
box-shadow: 0px 9px 28px 8px rgba(0, 0, 0, 0.05), 0px 6px 16px 0px rgba(0, 0, 0, 0.08), 0px 3px 6px -4px rgba(0, 0, 0, 0.12);
border-radius: 2px;

}

 

.droplist-item {
border-bottom: 1px solid #EFEFF4;
height: 0.32rem;
padding-left: 0.08rem;
font-size: 0.14rem;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #3389FF;
}

.droparrowbg {
position: relative;
height: 100%;

}

.droparrowbg::after {
content: '';
position: absolute;
width: 0;
height: 0;
top: -0.1rem;
left: 0.5rem;
border-left: 0.1rem solid transparent;
border-right: 0.1rem solid transparent;
border-bottom: 0.1rem solid white;
}

.input-companyname {
display: flex;
flex: 1;
flex-direction: row;
height: 0.67rem;
align-items: center;
width: 100%;
background: #fff;
padding: 0 0.24rem;
font-size: .14rem;
font-family: PingFangSC-Regular, PingFang SC;
}

.ipt-companyname-title {
color: #6D89AF;
width: 1rem;
flex-shrink: 0;
font-weight: 500;
}

.ipt-companyname-holder {
display: flex;
flex: 1 1;
height: 100%;
align-items: center;
color: #113260;
}

.ipt-companyname {
display: flex;
flex: 1 1;
height: 0.5rem;
color: #113260;
font-weight: 400;
}

<div style="position: relative;">
            <div class="input-companyname">
              <div class="ipt-companyname-title">公司名称</div>
              <div class="ipt-companyname-holder">
                <input class="ipt-companyname" v-model="legalpersoninfo.busname" @input="companynameinput" placeholder="请输入公司名称" />
              </div>
            </div>
            <div class="droplist-content" v-show="showdroplist">
              <div class="droparrowbg">
                <div style="overflow: scroll;height: 100%;">
                  <div class="droplist-item" v-for="(city,index) in companyList" :key="index" @click="droplistItemClick(city)">
                    {{city}}
                  </div>
                </div>
              </div>
            </div>
            <com-spline></com-spline>
          </div>

 最终效果