我正在使用Vue.js 2.0开发应用程序。和Vuex用于国家管理。我需要实现所谓的品牌推广的可能性，即用户需要能够为他们的帐户选择一个主题，然后将特定的颜色应用到应用程序中。风格。
我选择并设法实现作为概念验证的第一个选项是使用Vuex将所需的样式作为Vuex对象存储在应用程序商店中，然后我将其用于绑定到所需元素的样式适用于。用于选择颜色的颜色选择器触发状态上的突变以改变颜色。这样做完全正常，并且使用起来甚至太难，因为它只允许使用如下表达式：style =＆＃34; $ store.state.brand＆＃34;在它需要应用的html元素上。当我改变颜色时，它会更新所有组件。该选项具有其优点，因为它非常简单，并且还允许用户从颜色选择器中选择他/她想要的任何颜色。但是，它在设计方面有其局限性，因为复杂的样式无法以这种方式实现（例如悬停时的颜色变化，标签或页面的活动类等）。
因此，我想尝试向客户推荐的第二个选项是拥有一组用户可以选择的预定义主题。这些主题将在css文件中定义（使用sass / less或类似的东西）。我现在需要实现的是：
当用户选择主题时，让我们从下拉列表中说，我想从相应的css文件加载应用程序的样式并重新加载应用程序以反映这些更改。 在Vue中执行此操作的最有效和最佳实践方法是什么？
答案 0 :(得分：3)
因此，如果其他人需要这个，我们最终使用样式化组件。有关详细信息，请结帐https://www.npmjs.com/package/vue-styled-components。我们为需要接收指定主题颜色（按钮，单选按钮，标题，菜单项等）的元素创建了样式化组件，并将它们作为道具传递给所需的颜色。 prop的值来自Vuex商店，因此它在整个应用程序中是一致的。这种方法的好处是颜色选择对于客户来说是无限的（与我们正在考虑的预定义主题相比）。此外，另一个好处是，现在客户可以通过颜色选择器改变vuex商店中的颜色，并看到主题改变现场。最后，这种方法还使您能够使用css的所有功能，例如使用css选择器创建更复杂的样式。对于常规的vue样式绑定，这是不可能的。如果您需要更多详细信息，请随时与我联系。