此功能可解决什么问题?
请考虑以下组件
<template>
<div>
{{title}}
</div>
</template>
<script>
export default {
name: 'awesomeTitle',
props: {
title: String
}
}
</script>
使用此组件时,现在无法在div上设置title html属性
<awesomeTitle title="Hello world" title.native="Oopsy"/>
这只会输出
<div title.native="Oopsy">Hello world</div>
而不是
<div title="Oopsy">Hello world</div>
为props添加native修饰符将允许避免html属性和vue props之间的冲突。
它已经存在于事件侦听器中,因此它也将更加一致。
有时库会忘记html属性继承是一件事,在那些组件中添加一些html属性变得不可能,这也会使组件更能适应未来的需求,以防在规范中添加新的html属性,因为你不必再担心未来的冲突
建议的API是什么样子的?
<awesomeTitle title="Hello world" title.native="Oopsy"/>
6条答案
按热度按时间qf9go6mv1#
当你想允许一个属性时,使用一个与该属性同名的属性是令人困惑的。但我认为这值得通过RFC来收集反馈:https://github.com/vuejs/rfcs的最大值
w1e3prcc2#
.prop
似乎可以工作,但仅限于绑定,不确定是否是预期的https://codepen.io/jkarczm/pen/rNeLyLG?editors=1010的最大值
ckx4rj1h3#
@jacekkarczmarczyk很肯定这不是,只是一个奇怪的副作用,但至少这个问题得到了一个非常黑客的工作区现在
xwbd5t1u4#
@jacekkarczmarczyk道具的修饰符似乎只适用于绑定,而不是普通属性,似乎是一个bug,在这种情况下,这个问题可以使用显然已经存在的道具修饰符来解决
q9rjltbz5#
prop修饰符并不是一种技巧,它可以处理具有等价属性的属性
vd2z7a6w6#
@posva我的意思是,它只适用于绑定,所以你必须使用引号和单引号