我想插入组件内联css之类的
<div id="slide1" :style="item.css" v-html="item.html" />
我的item.css包含具有很多CSS定义的字符串，例如
#slide1 {} #slide1 p {} #slide1 h2 {} @media(...) { #slide {} } ....
执行此操作的最佳方法是什么？
答案 0 :(得分：0)
因此，您在此处执行的操作不是加载样式，而是加载完整的css规则集。 HTML元素的style属性只能让您添加css属性，而不能添加#slide1 {...}之类的规则块。
如果要远程加载单个组件的规则，则需要对组件使用范围限定的样式块（假设您正在使用single file components），如下所示：
<template>
...
</template>
<style scoped>
@import url("link-to-your-remote-styles");
</style>
我们在上面做的是：
scoped标签的<style>属性，确保该组件中加载的样式不会超出其范围； Here's a link to a sandbox，我仅在一个组件的范围内加载顺风。