css - 如何从 Vue 组件中获取 CSS 值？

Question

我正在尝试从组件中获取css值。vue我想要的是像这样以字符串格式接收vue组件的css

"#about {
    margin: 70px;
}
#header {
    color: blue;
    font-size: 30px;
}
#sub-header {
    color: blue;
    font-size: 10px;
}
.text {
    border: 1px solid #4caf50;
}"

在我的情况下document.styleSheets不做这项工作。我需要其他方法从 vue 组件获取 css。

这是我试图从中获取 css 的示例模板：

<template>
    <div id="about">
        <div id="header">This is an about page</div>
        <div id="sub-header">CSS Margins</div>

        <div class="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris id dictum nisi. </div>
        <br>
        <div class="text">Pellentesque vehicula sollicitudin nisl, vitae feugiat justo condimentum vel. Integer tellus nisi, porttitor sit amet sodales sit amet, imperdiet a nisl.</div>
    </div>
</template>
<style scoped>
#about {
    margin: 70px;
}
#header {
    color: blue;
    font-size: 30px;
}
#sub-header {
    color: blue;
    font-size: 10px;
}
.text {
    border: 1px solid #4caf50;
}
</style>

标签： cssvue.js