vuejs / vuejs/docs

Temperature converter - 'change' event causes confusion

Open
#2,143 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

discussion
Dominant language
Vue
Stars
3.2k
Forks
5k
Avg merge
14d 17h
Merged PRs (30d)
1

Description

The temperature converter example currently uses a change event on the <input> fields to react to changes. This has led to some confusion, because the change event doesn't fire on every keystroke, giving the impression that the example doesn't work.

One way to fix that is to use the input event instead, but that brings its own problems:

SFC Playground

Specifically, if you try to remove the contents of one of the fields it will suddenly jump to a value of 0. This only happens if the current value is not already 0, so it is possible to clear the field if you try to do it twice.

It is possible to fix that problem too, but I haven't been able to find a way to do it that doesn't make the example appear cluttered.

We've had two PRs that try to switch from change to input, #1600 and #1924, but neither has been merged because of the extra problems that introduces.

I'm unclear how best to resolve the confusion the current example causes.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the temperature converter example and reproduce the behavior in the linked SFC Playground, comparing the current change event with the input event. Review PRs #1600 and #1924 for prior approaches; done means the example no longer suggests it is broken while avoiding the field-clearing behavior described here.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
documentation, frontend
Issue type
Bug
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.