A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://github.com/vuejs/vue/issues/7811 below:

v-bind=$attrs overrides the input type attribute in 2.5.14 and above · Issue #7811 · vuejs/vue · GitHub

Version

2.5.14

Reproduction link

https://jsfiddle.net/linnea/onw3Lfm4/2/

Steps to reproduce

Create a custom component with an input wrapped in a div and:

  1. inherit attributes
    v-bind="$attrs"
  2. Set the type attribute on the input
    type="checkbox"
  3. Have a v-model on that input.
What is expected?

The inner input still receives type="checkbox"

What is actually happening?

No type attribute is inherited

We have a custom checkbox component that provides label styling etc, and used to be able to declare the input type as well as inherit attributes from the component. Other attributes that are set on the inner input are passed correctly (ie disabled, :true-value, etc), but not the type attribute, unless you bind it. This was working prior to v2.5.14.

A temporary fix we've implemented is changing type="checkbox" to :type="'checkbox'", or setting v-bind="$attrs" to a computed property that returns an object with Object.assign({ type: 'checkbox'}, this.$attrs);

Removing the v-model from the input also fixes it, but we use it to handle multiple checkboxes, bound to the same array

Here's the same fiddle above, working in 2.5.13
https://jsfiddle.net/linnea/onw3Lfm4/4/


RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4