vue单个页面设置背景

1,270 阅读1分钟

在vue使用的时候可能会碰到某一页面需要变换背景颜色,在全局页面设置中又不太可能,下面仅需四步就可以完成此操作

第一步,设置id

<template>  <div id="my">      </div></template>

第二步,在mounted里给body设置样式

mounted() {    document.querySelector('body').setAttribute('style', 'background-color: #F7F8FF')}

第三步,数据加载时给我们id为box设置背景颜色,因为body背景填充色只填充一屏,超过一屏后会变成默认的背景色

document.querySelector('body').setAttribute('style', 'background-color: #F7F8FF')

第四步,页面退出清空填充的body色

beforeDestroy() {    document.querySelector('body').removeAttribute('style')}