fix(input): input maxlength calculate the correct length #2654
Conversation
|
|
|
fix #2653 |
|
I’ve left few comments, please address them before it gets merged, I am happy to approve this PR after all comments are resolved. Thank you for your contribution! 👍 |
It's fixed ~ |
packages/input/src/index.vue
Outdated
| }) | ||
| const inputExceed = computed(() => { | ||
| // show exceed style if length of initial value greater then maxlength | ||
| return isWordLimitVisible.value && (textLength.value > upperLimit.value) | ||
| return isWordLimitVisible.value && (textLength.value > props.maxlength) |
There was a problem hiding this comment.
I found a potential bug though, the type of maxlength says it can be both string and number type, I think yo need to parse maxlength before comparison operation. WDYT?
There was a problem hiding this comment.
It is my opinion that
- The maxlength only allows the number type
maxlength: {
type: Number,
},return isWordLimitVisible.value && (textLength.value > Number(props.maxlength) )Compatible with past string types
| if (props.maxlength) { | ||
| const sliceIndex = inputExceed.value ? textLength.value : props.maxlength | ||
| // Convert value to an array for get a right lenght | ||
| value = Array.from(value).slice(0, Number(sliceIndex)).join('') |
There was a problem hiding this comment.
Like here you used Number(index) to make sure that the value is number even though '5' > '4' holds true but that doesn't mean that we can do so.
jw-foss
added
Contribution::Community
Project::Enhancement
| @@ -222,6 +222,9 @@ export default defineComponent({ | |||
| type: Object, | |||
| default: () => ({}), | |||
| }, | |||
| maxlength: { | |||
There was a problem hiding this comment.
@wen-haoming but you made the type string acceptable here, so I thought you need to do a string parse before doing actual arithmetic operations
There was a problem hiding this comment.
Since we do not want to break the old functionality as passing that to <input /> which accepts both string and number type. I do think that you need to perform a Number or parseInt for maxlength though.
Please make sure these boxes are checked before submitting your PR, thank you!
devbranch.