vuejs 怎么获取修改scss变量

Vue.js本身并不直接操作SCSS变量，因为它是一个前端JavaScript框架，主要用于构建用户界面。然而，你可以通过以下步骤间接地在Vue组件中使用SCSS变量：

1. 首先，在项目中设置支持SCSS预处理器。可以使用像`vue-cli`这样的脚手架工具，并配置Webpack来处理SCSS。

2. 在`.vue`文件中的`style`标签中，使用`:global`伪类来引用全局变量，如：

   <template>
     <div>
       <p :style="{ color: $myColor }">Hello, World!</p>
     </div>
   </template>

   <script>
   export default {
     data() {
       return {};
     },
     // 在这里不需要设置变量，因为它们在SCSS文件中管理
   };
   </script>

3. 在你的SCSS文件中定义变量，例如`src/assets/styles/main.scss`:

   $myColor: red;

   /* 其他样式 */
   p {
     :global {
       color: $myColor;
     }
   }

4. 如果你需要在Vue组件内部动态更改SCSS变量，可以利用CSS Modules或者使用一些插件（比如`sass-resources-loader`），但这通常不是常规做法，因为Vue更倾向于数据驱动视图。