CODEWITHSUNDEEP
typescriptvue.jsvuejs2
user15909643
user15909643

Reputation:

Vue/Typescript: Checked is not a property on HTMLInputElement type

I have a method that handles a box check but I am getting an issue with target on the event type.


    <input
        @change="$emit('change', $event.target.checked)"
        @keyup.enter="boxCheck($event)"
        :checked="checked"
        ref="test-input"
        type="checkbox"
   />
////
    boxCheck($event: HTMLInputElement) {
      if ($event?.target?.checked) {
        $event.target.checked = !$event.target.checked;
        this.$emit('change', $event.target.checked);
      }
    },

my error is Property 'target' does not exist on type 'HTMLInputElement but I thought only HTMLInputElement could be used for this.

Upvotes: 2

Views: 998

Answers (1)

Ohgodwhy
Ohgodwhy

Reputation: 50787

The boxCheck method is receiving an Event not an HTMLInputElement. You can derive the type of the element based on your usage by casting the target within the method, such as below:

boxCheck($event: Event) {
  const el = $event.target as HTMLInputElement

  // el.checked now holds reference to what you need
}

Upvotes: 2

Related Questions