jeecg框架修改默认的白色背景

最新推荐文章于 2024-01-02 20:59:09 发布

Ciito

最新推荐文章于 2024-01-02 20:59:09 发布

阅读量196

点赞数

文章标签：前端 vue jeecgboot

本文链接：https://blog.csdn.net/weixin_45672928/article/details/134177528

版权

jeecg框架修改默认的白色背景

原背景
一个组件解决更换背景色

<template>
  <div class="main-warp">
    <slot></slot>
  </div>
</template>

<script>
export default {
  name: 'GreyBackground',
  data() {
    return {}
  },
  computed: {},
  watch: {},
  beforeDestroy() {
    this.getLayoutContent().classList.remove('common-grey')
  },
  mounted() {
    this.setBackground() // 重置.global-layout-wrapper .layout-content背景色
  },
  methods: {
    getLayoutContent() {
      return document.querySelector('.layout-content')
    },
    setBackground() {
      this.getLayoutContent().classList.add('common-grey')
    }
  }
}
</script>
<style lang="less">
.common-grey {
  background-color: #f0f2f5 !important;
  padding: 0 !important;
}
</style>
<style lang="less" scoped>
.main-warp {
  width: 100%;
  height: 100%;
}
</style>