Vue.js 当已经指定属性时，是否仍要绑定该属性？

我正在尝试在ASP.NET核心应用程序中使用Vue.js。我在页面上使用了某些标记帮助程序，它们添加自己的HTML属性，在某些情况下，我需要向同一属性添加

v-bind

。但是，当我这样做时，显式定义的属性总是胜过

v-bind

。例如：

<span v-bind:id="foo"></span>

当Vue处理此操作时，结果是：

<span id="bar"></span>

当然，这是一个非常明显的边缘案例。如果所有的东西都是手工编码的，你就永远不会同时包含这两个。然而，似乎应该有某种方法来实现

v-bind

覆盖。是否有我遗漏的东西，或者有人有什么好主意，我可以如何解决这个问题

编辑

对不起，伙计们。我想我没有说得那么清楚

id

这里只是一个例子。这不是CSS的事情。我不能“只使用

类

”。我需要能够绑定到必要的属性

问题是我无法控制即将进入的属性。我的实际代码没有该属性，只是

v-bind:attribute

。标记帮助器正在将属性添加到my

v-bind

之外，我只希望my

v-bind

优先于属性本身

---

您的问题基本上可以归结为：某些服务器端应用程序在Vue模板中呈现HTML标记，该模板在同一属性上同时具有显式设置属性和

v-bind

。这与生成此代码的内容无关，因此问题实际上与ASP.NET核心无关，只与同一属性使用两次有关。现在，您希望Vue将显式设置的属性替换为其绑定值

当一个元素已经定义了一个属性，并且它有一些值要绑定到该元素时，Vue实际上会这样做。同样的情况也适用于文档中包含的组件。该部分还解释了一些

类

和

样式

属性发生的值合并：

对于大多数属性，提供给组件的值将替换组件设置的值。例如，传递

type=“text”

将替换

type=“date”

，并且可能会破坏它！幸运的是，

类

和

样式

属性稍微聪明一些，因此这两个值都被合并，使最终值：

表单控件日期选择器主题变暗

无论如何，如果运行此代码段，您可以看到Vue在绑定值时确实替换了最初在值中设置的值：

var-app=新的Vue({
el:“#应用程序”，
数据：{
foo：‘baz’，
},
});
//显示呈现的HTML
document.getElementById（'pre'）。addEventListener（'click'，function（）{
this.textContent=app.$el.innerHTML；
});

福吧巴兹酒店
（单击此处显示应用程序的内部HTML）
@KirkLarkin:这很有趣。我没有自己尝试（我的错，我应该这么做），但我可以确认源代码包含
，也就是说，它不像标记帮助程序正在删除我的
v-bind
或其他东西。它就在那里，一旦返回了响应，ASP.NET核心就不存在了。我不确定我所拥有的和您在JSFIDLE中创建的之间的确切区别，但这至少给了我一个梳理差异的路径。好吧，我还没有更新到最新的补丁（运行2.5.16和2.5.17当前版本）。我不确定这是否有什么不同，但我肯定可以尝试更新，看看它是如何进行的。
<span id="bar" v-bind:id="foo"></span>

<span id="bar"></span>