Open
Description
What problem does this feature solve?
Consider the following component
<template>
<div>
{{title}}
</div>
</template>
<script>
export default {
name: 'awesomeTitle',
props: {
title: String
}
}
</script>
When using this component it now becomes impossible to set the title html attribute on the div
<awesomeTitle title="Hello world" title.native="Oopsy"/>
This would just output
<div title.native="Oopsy">Hello world</div>
Instead of
<div title="Oopsy">Hello world</div>
Adding the native modifier for props would permit to avoid collision between html attributes and vue props.
It already exists for event listeners so it would also be more coherent.
Sometime libraries will forget that html attributes inheritance is a thing and adding some html attributes becomes impossible in those components, it will also make the component more future proof in case new html attributes are added in the spec as you don't have to worry about future collisions anymore
What does the proposed API look like?
<awesomeTitle title="Hello world" title.native="Oopsy"/>