Subscribe on changes!

Shorthand v-bind

avatar
Jul 7th 2023

What problem does this feature solve?

If I want to use v-bind on a component where the value I want to use is the same as the name of the property, it is redundant. It will provide a better developer experience to remove this redundancy.

What does the proposed API look like?

Current:

<!-- example.vue -->

<script>
export default {
  data() {
    return {
      somedata: true,
    };
  }
}
</script>

<template>
  <SomeComponent :somedata="somedata" /> <!-- notice we have to use the same word twice, which is redundant and unnecessary --> 
</template>

Proposed:

<!-- example.vue -->

<script>
export default {
  data() {
    return {
      somedata: true,
    };
  }
}
</script>

<template>
  <SomeComponent :somedata /> <!-- Automatically using the somedata value -->
</template>
avatar
Jul 7th 2023

Duplicate of #8178.