在vuejs女巫类中传递多个属性

Question

我正在尝试通过使用全局混合来创建具有BEM方法的可重用组件。 这是我在此示例https://codesandbox.io/s/ojyym18355

中试图做的一个实时示例

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

Answer 1

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

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

这意味着最后一个值将覆盖class绑定，而您只剩下一个值test--one。

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

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