Skip to content

[Bug]: Data Binding Not Updating with Number Input (AutoForm) #8

@Us3r-gitHub

Description

@Us3r-gitHub

Reproduction

https://github.com/Us3r-gitHub/Playground-Nuxt/tree/auto_form-data_binding

Describe the bug

The data binding for Vue reactivity does not update as expected.

Steps to Reproduce:

  1. Define a reactive variable in Vue.
  2. Define a zod schema.
  3. Create a component and register the Vue reactivity on it.
  4. Update the input value, and observe the behavior.

Expected Behavior:

The reactive variable should update automatically when the input value changes, reflecting the updated value in the component.

Actual Behavior:

The reactive variable does not update with the new value from the input and continues to use the initial value.

Screenshot

image
From the screenshot above, data binding works perfectly with the text input, but the issue occurs when using the number input.

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (8) x64 Intel(R) Core(TM) i5-9300H CPU @ 2.40GHz
    Memory: 10.12 GB / 23.85 GB
  Binaries:
    Node: 20.16.0 - E:\Program Files\nodejs\node.EXE
    Yarn: 1.22.22 - E:\Program Files\nodejs\yarn.CMD
    npm: 10.8.1 - E:\Program Files\nodejs\npm.CMD
    pnpm: 9.12.3 - E:\Program Files\nodejs\pnpm.CMD
    bun: 1.1.6 - ~\.bun\bin\bun.EXE
  Browsers:
    Edge: Chromium (127.0.2651.98)
    Internet Explorer: 11.0.22621.3527
  npmPackages:
    @vueuse/core: ^11.3.0 => 11.3.0
    nuxt: ^3.14.159 => 3.14.159
    radix-vue: ^1.9.9 => 1.9.9
    shadcn-nuxt: ^0.11.2 => 0.11.2
    vue: latest => 3.5.12

Contributes

  • I am willing to submit a PR to fix this issue
  • I am willing to submit a PR with failing tests

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions