vue单独给页面设置body属性
因项目需求:用户个人详细信息页面设置背景色,之前在这个页面设置最外层div发现不行。因为app.vue影响了它。后来直接在页面上用body设置样式,发现影响了其他页面。
后来想了通过vue的生命周期来解决。这个页面创建前设置我的样式,销毁之前移除我设置的样式。
代码如下:
//创建前设置
beforeCreate () {
document.querySelector('body').setAttribute('style', 'background-color:#efeff4;')
},
//销毁前清除
beforeDestroy () {
document.querySelector('body').removeAttribute('style')
},
vue单独给页面设置body属性的更多相关文章
- vue.js初探:计算属性和methods
在vue.js中,计算属性和methods方法的函数相同时,两者的最终执行结果都是相同的.然而不同的是,计算属性是基于它的依赖缓存.计算属性只有在它的相关依赖发生改变时才会重新取值.这就意味着只要 m ...
- Vue(十一)计算属性
计算属性 1. 基本用法 计算属性也是用来存储数据,但具有以下几个特点: a.数据可以进行逻辑处理操作 b.对计算属性中的数据进行监视 2.计算属性 vs 方法 将计算属性的get函数定义为一个方法也 ...
- vue给对象新添加属性,一定要使用Vue.set( target, key, value )这个API来添加
this.tagList = [{ id:1, tagName:'90后' }, { id:2, tagName:'土豪' }, { id:3, tagName:'美女' }, { id:4, tag ...
- vue data对象添加新属性触发视图
<template> <div class="wrap open"> <a>{{test01.name}}</a> <a> ...
- Vue.2.0.5-计算属性
计算属性 在模板中绑定表达式是非常便利的,但是它们实际上只用于简单的操作.在模板中放入太多的逻辑会让模板过重且难以维护.例如: <div id="example"> { ...
- Vue.js学习 Item5 -- 计算属性computed与$watch
在模板中绑定表达式是非常便利的,但是它们实际上只用于简单的操作.模板是为了描述视图的结构.在模板中放入太多的逻辑会让模板过重且难以维护.这就是为什么 Vue.js 将绑定表达式限制为一个表达式.如果需 ...
- [js高手之路] vue系列教程 - 绑定设置属性的多种方式(5)
一.设置属性的值: {{data中的数据}} window.onload = function () { var c = new Vue({ el : '#box', data : { url : ' ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十八║Vue基础: 指令(下)+计算属性+watch
回顾 今天来晚辣,给公司做了一个小项目,一个瀑布流+动态视频控制的DEMO,有需要的可以联系我,公司的项目就不对外展示了(一个后端程序员真的要干前端了哈哈哈). 书接上文,昨天正式的开始了Vue的代码 ...
- 【Vue 2.x】计算属性
Vue对象,按照现在的学习进度,可以分为: 其中el代表作用的HTML元素: data代表el中的所有数据: methods代表el中所有元素上的事件: computed代表计算属性,用于计算data ...
随机推荐
- spark-streaming读kafka数据到hive遇到的问题
在项目中使用spark-stream读取kafka数据源的数据,然后转成dataframe,再后通过sql方式来进行处理,然后放到hive表中, 遇到问题如下,hive-metastor在没有做高可用 ...
- idea中 在接口中如何直接跳转到该接口的是实现类中?
例如,我想跳转到UserInfoDao 这个接口的实现类中,操作如下: 把鼠标放到这个接口UserInfoDao 上面,右键,选择 GO To ,然后选择 Implementations,就可以直接跳 ...
- java中hashSet原理
转自: http://blog.csdn.net/guoweimelon/article/details/50804799 HashSet是JavaMap类型的集合类中最常使用的,本文基于Java1. ...
- Python面试题之Python面向对象编程汇总
面向对象的设计思想是从自然界中来的,因为在自然界中,类(Class)和实例(Instance)的概念是很自然的.Class是一种抽象概念,比如我们定义的Class——Student,是指学生这个概念, ...
- ipythons 使用攻略
ipython是一个 python 的交互式 shell,比默认的 python shell 好用得多,支持变量自动补全,自动缩进,支持 bash shell 命令,内置了许多很有用的功能和函数. 安 ...
- Mysql 整理错误
Mysql 启动报PID错误 Starting MySQL..ERROR! The server quit without updating PID file (/usr/local/mysql/da ...
- 20145314郑凯杰《信息安全系统设计基础》第6周学习总结 part A
第4章 处理器体系结构 part 1 本部分对改章节的知识点进行总结: 一个处理器支持的指令和指令的字节级编码称为它的指令集体系结构(ISA). 不同的出路器有不同的ISA. ISA模型看上去应该是顺 ...
- $(document).ready(function(){})和$(window).load(function(){})的区别
页面加载完成有两种状态: 1.Ready:表示文档结构已经加载完成,不包含图片等非文字媒体文件,在Dom节点创建完成后执行,如果有多个定义则依次执行 $(document).ready(functio ...
- 如何升级到python3版本并且安装pip3
如何升级到python3版本并且安装pip3 准备: Python-3.5.2.tar.xz pip-8.1.2.tar.gz setuptools-24.0.2.zip 步骤: 1.自定义编译安装p ...
- vue.js的一些小语法v-bind,v-if,v-show,v-else
知识点: v-bind 动态绑定标签属性 v-bind 可简写为 : 使用v-bind 绑定class和内联样式 使用v-if,v-show,v-else进行条件渲染 <template> ...