vue 动态添加body背景图片

<script>

export default {

  data () {

    return {

     bodyBgImage: 'url(' + require('../assets/bg.png') + ')'

    }

  },

  methods: {

        // 添加body图片

        setBodyBackGround () {

            document.body.style.backgroundSize = '100%'

            document.body.style.backgroundImage = this.bodyBgImage

      },

        // 清除背景图

        clearBodyBackGround () {

            document.body.style.backgroundImage = ''

      }

  },

  mounted(){

      // 进来的时候调用添加

        this.setBodyBackGround()

  },

  beforeDestroy(){

      // 离开页面的时候清除

        this.clearBodyBackGround()

  }

  

}

</script>