element-plus
element-plus copied to clipboard
fix(components): [select-v2] itemSize calc error when dynamic height
Please make sure these boxes are checked before submitting your PR, thank you!
- [x] Make sure you follow contributing guide English | (䏿–‡ | Español | Français).
- [x] Make sure you are merging your commits to
devbranch. - [x] Add some descriptions and refer to relative issues for your PR.
Using dynamic height on select-v2 will cause height calculation errors play
👋 @james-curtis, seems like this is your first time contribution to element-plus.
- Please make sure that you have read our guidelines and code of conduct before making a contribution.
- You can comment with
/label Components:[component_name]to add a label for which component you are working on. - You may join our
for staying tuned.
Hello @james-curtis, thank you for contributing to element-plus, please see our guideline to see how to make contribution
There seems to be a problem with the play link, and the content cannot be rendered normally.
There seems to be a problem with the
playlink, and the content cannot be rendered normally.
Yes, at this time, the CPU utilization rate of the browser will be very high. There is a calculation error. That's the problem
Please make sure these boxes are checked before submitting your PR, thank you!
- [x] Make sure you follow contributing guide English | (䏿–‡ | Español | Français).
- [x] Make sure you are merging your commits to
devbranch.- [x] Add some descriptions and refer to relative issues for your PR.
Using dynamic height on select-v2 will cause height calculation errors play
The code of play is like this
<template>
<el-select-v2
v-model="value"
:options="options"
placeholder="Please select"
:estimatedOptionHeight="50"
/>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
const initials = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j']
const value = ref('')
const options = Array.from({ length: 1000 }).map((_, idx) => ({
value: `Option ${idx + 1}`,
label: `${initials[idx % 10]}${idx}`,
}))
</script>
<style scoped>
.example-showcase .el-select-v2 {
margin-right: 20px;
}
</style>
:estimatedOptionHeight="50" caused the bug