vue2&ElementUi实现select选择器自适应宽度

最新推荐文章于 2024-05-22 11:12:12 发布

月色真美121

最新推荐文章于 2024-05-22 11:12:12 发布

阅读量1.7k

点赞数

分类专栏： select 文章标签： elementui javascript vue.js

本文链接：https://blog.csdn.net/qq_45410455/article/details/127471792

版权

select 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

由于最近在开发大屏项目涉及到图表的下拉选择想到选择的数可能过长
在这里插入图片描述
就想着优化一下select 在网上查找资料后有了大概的思路利用prefix插槽

先看下效果

下面贴上代码

在这里插入代码片
 <el-select
      v-model="streetId"
      :popper-append-to-body="false"
      class="active_select"
      @change="change"
    >
      <template slot="prefix">
        {{ (optins.find((v) => v.id === streetId) || {}).name }}
      </template>
      <el-option
        v-for="item in optins"
        :key="item.id"
        :label="item.name"
        :value="item.id"
      />
    </el-select>