vue.js - 在 vuejs 女巫类中传递多个属性

Question

我正在尝试通过使用全局 mixin 来创建具有 BEM 方法的可重用组件。这是我在这个例子中尝试做的一个活生生的例子https://codesandbox.io/s/ojyym18355

如您所见，我希望能够将多个道具作为带有类的数组传递，因此它将呈现test test--one，到目前为止只有最后一个类test--one被输出。知道如何解决这个问题吗？谢谢你！

标签： vue.js

Answer 1

在您的代码示例中，当您以这种方式添加多个绑定时v-bind="[test, test_one]"，它会转换为元素上的以下绑定：

class="test"
class="test--one"

这意味着最后一个值会覆盖class绑定，并且您只剩下一个test--one.

作为一种解决方案，类可以以与多个绑定相同的方式传递——作为数组或对象。这是一个例子：

请注意，这是更灵活地使用绑定的示例。为了有效地复用组件，mixindata属性的初始数据格式可能需要调整。