'I want to know why this input element is checked but the view is not match

enter image description here

when i creat a webpage with Vue,something happen,in this picture.



Solution 1:[1]

The checked attribute represents the default, not the current, value.

It doesn't update as the user interacts with the UI.

Solution 2:[2]

This is a possible way to reproduce:

document.getElementById("foo").checked = false;
<label for="foo">Click me <input id="foo" type="checkbox" checked="checked"></label>

Your HTML element has a checked property which is usually true or false. You will need to refer that attribute in order to properly detect the value.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Quentin
Solution 2 Lajos Arpad