一般做共享变量用于主题功能

假设我们在xxx.scss中声明了一个 theme:blue，我们在 js 中该怎么获取这个变量呢？我们可以通过import variables from '@/styles/variables.scss'将变量取出来,然后通过js去改变变量的值即可,在做主题时还需要用到浏览器的cookie缓存,当我们改变主题颜色时在改变sass变量的色值时将颜色储存进cookie中,在下次访问页面时从cookie中取出重新赋给sass即可完成主题的持久化

声明:

取值:

赋值:

sass和js的联动(共享变量)的更多相关文章

  1. [js开源组件开发]js手机联动选择地区仿ios 开源git

    js手机联动选择地区 前言:由于网上找到了一个mobiscrool,比较全,但是不开源,只能试用15天,正式版竟然要三千块钱,穷人只能自己动手,写了个只针对弹窗地区选择的. 本站点所有的资源均在git ...

  2. [js开源组件开发]js手机联动选择日期 开源git

    js手机联动选择日期 这里在前面的<js手机联动选择地区>的基础上,改造数据源之后形成的一个日期的选择器,当然你可以使用之前的PC上模式的<日期控件>,它同时也支持手机端,ht ...

  3. [JS]以下是JS省市联动菜单代码

    以下是JS省市联动菜单代码: 代码一: <html> <head> <title></title> <script language=" ...

  4. JS省市区联动效果

    省市区联动下拉效果在WEB中应用非常广泛,尤其在电商网站最为常见.一般使用Ajax实现无刷新下拉联动.利用jQuery,通过读取JSON数据,实现无刷新动态下拉省市二(三)级联动效果. 首先我们可以看 ...

  5. js 多级联动（省、市、区）

      js 多级联动(省.市.区) CreateTime--2018年4月9日17:10:38 Author:Marydon 方式一: 数据从数据库获取,ajax实现局部刷新 方式二: 数据从json文 ...

  6. 省市区js三级联动（原创）

    看了一些网上的js三级联动,但感觉不是缺这,就是少那,决定亲自操刀写了一个,现记录如下,以备后用! <!DOCTYPE html> <html> <head> &l ...

  7. 原生js二级联动

    今天说的这个是原生js的二级联动,在空白页面里动态添加并作出相对应的效果. 1 //创建两个下拉列表 select标签 是下拉列表 var sel = document.createElement(& ...

  8. 原生js的联动全选

    开发应用中有很多工具可以使用,下面介绍一个原生js写的联动全选思路!!! <!DOCTYPE html> <html lang="en"> <head ...

  9. 前端js 省市联动

    代码下载地址 <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

随机推荐

  1. 缩减Azure上Linux虚拟机系统盘容量

    [话在前头] 这么些年微软 Azure 创建虚拟机一直不能修改系统盘大小,但很多时候实际又用不了这么大的操作系统磁盘.微软自己甚至还针对 Windows 服务器镜像推出一个 smalldisk 的镜像 ...

  2. Bugku-域名解析

    做题之前了解一下域名解析,域名是为了方便记忆而专门建立的一套地址转换系统,要访问一台互联网上的服务器,最终还必须通过IP地址来实现,域名解析就是将域名重新转换为IP地址的过程.一个域名对应一个IP地址 ...

  3. 从门外汉到腾讯Android高级研发——一个半路出家菜鸟的艰难逆袭之路

    我是在去年3月份加入腾讯公司,目前是腾讯公司某技术部门里面的一个小负责人,年薪月薪大税后概30K,谈不上多么厉害,但在回想自己半路出家学习编程,从一个销售到现在终于进入中国互联网顶尖公司,还是有些许感 ...

  4. JavaWeb项目实战-油画商城

    整个项目都已经上传到github-mmgallery上,供有需要的读者使用,主要文件来自于csdn,区别是csdn中的项目数据存储在MySQL中,本项目数据存储在Xml文件中.课件和学习视频课程来自M ...

  5. xv6学习笔记(3):中断处理和系统调用

    xv6学习笔记(3):中断处理和系统调用 1. tvinit函数 这个函数位于main函数内 表明了就是设置idt表 void tvinit(void) { int i; for(i = 0; i & ...

  6. STM32—驱动GY85-IMU模块

    GY85是一个惯性测量模块,内部集成了三轴加速度计.三轴陀螺仪.电子罗盘.气压传感器等芯片,用于测量和报告设备速度.方向.重力,模块可以将加速度计.陀螺仪.电子罗盘等传感器的数据进行综合,在上位机可以 ...

  7. 内存吞金兽(Elasticsearch)的那些事儿 -- 认识一下

    背景及常见术语 背景 Elasticsearch 是一个开源的搜索引擎,建立在一个全文搜索引擎库 Apache Lucene 基础之上. Lucene 可以说是当下最先进.高性能.全功能的搜索引擎库- ...

  8. 【AIOT】智能感知--物

    From: https://liudongdong1.github.io/ 1. 物体检测 .1. 流体 D. V. Q. Rodrigues, D. Rodriguez and C. Li, &qu ...

  9. [ES6深度解析]12：Classes

    我们将讨论一个老问题:在JavaScript中创建对象的构造函数. 存在的问题 假设我们想要创建最典型的面向对象设计的示例:Circle类.假设我们正在为一个简单的Canvas库编写一个Circle. ...

  10. The Programmer's Oath程序员的誓言----鲍勃·马丁大叔（Bob Martin）

    In order to defend and preserve the honor of the profession of computer programmers, I Promise that, ...