Skip to content

Examples of Form-Input-Components-using-Custom-Events contain bugs #887

Closed
@Silencesnow

Description

@Silencesnow

https://vuejs.org/v2/guide/components.html#Form-Input-Components-using-Custom-Events
the first example about "a component to work with v-model" contain a validator function,howerver,you can not enter a number greater than 2 digits, such as 123.45, the code is as follows:

var formattedValue = value
        // Remove whitespace on either side
        .trim()
        // Shorten to 2 decimal places
        .slice(0, value.indexOf('.') + 3)

The reason is that the input will trigger an input event to trigger this validation function. When the input does not contain ".", The value.indexOf('.') always returns -1, so the .slice(0, value.indexOf('.') + 3) always returns the total .slice (0,2), thus limiting the input.
It is recommended to add a judgment as follows:

var formattedValue = value
        // Remove whitespace on either side
        .trim()
        // To determine whether it is included "." and shorten to 2 decimal places
        .slice(0, value.indexOf('.')==-1?(value.length):(value.indexOf('.')+3))

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions