vue单独给body设置属性

最新推荐文章于 2024-04-18 20:20:27 发布

转载最新推荐文章于 2024-04-18 20:20:27 发布 · 2.5k 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：https://www.cnblogs.com/jiangweichao/p/9920654.html

vue 专栏收录该内容

45 篇文章

订阅专栏

本文探讨了Vue.js中beforeCreate和beforeDestroy生命周期钩子的使用，具体演示了如何在组件创建前设置全局样式，并在组件销毁前清除这些样式，以确保应用状态的整洁。

这个页面创建前设置我的样式，销毁之前移除我设置的样式。

//创建前设置
beforeCreate () {
      document.querySelector('body').setAttribute('style', 'background-color:#efeff4;')
},
//销毁前清除
beforeDestroy () {
      document.querySelector('body').removeAttribute('style')
},

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

云烟溪雪

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

Vue-cli中为单独页面设置背景色的实现方法

08-28

在 Vue-cli 项目中，为单独页面设置背景色的实现方法是使用 fixed 属性，并将背景色设置到整个屏幕上，而不仅仅是当前页面的容器。这是一种非常实用的解决方案，可以使我们的页面更加美观和易于使用。

vue body的背景图片属性设置

敲代码无敌小奶龙的博客

10-11

2234

Vue body背景图的设置

参与评论您还未登录，请先登录后发表或查看评论

Vue 单独页面设置 body 样式

weixin_44590591的博客

01-07

6870

需求：针对不同的页面，的样式需要做一些变化。比如不同页面设置不同的背景色，如果直接在页面里设置 body 的样式，页面并不会生效，如下： <template> <div>单独页面</div> </template> <style> body { backgroud-color: #ccc; min-width:400px; } </style> 解决方法 <template> <

vue属性绑定和style

dremcl的博客

03-19

243

属性绑定 1.在VS Code中新建一个HTML文件，在body标签中新建一个p标签!保存在心网页打开！ <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, in...

如何在网页中动态为模版页的Body添加属性

weixin_33898233的博客

12-26

415

如何在网页(aspx.cs)中动态去为模版页(masterpage)的Body节点添加属性。文件格式：.wmv；大小：8,414KB；长度：00:10:41。下载地址：http://download.cnblogs.com/insus/ASPDOTNET/DynamicallAddPropertyForMasterpageBody.zip ...

vue中给body单独设置样式

最新发布

07-24

通常，amfe-flexible设置根字体大小是为了让rem单位能够根据屏幕宽度自适应，而body的字体大小可以单独设置，但通常也会使用rem单位，以便跟随根字体大小变化。根据引用[2]中的示例，他们使用了媒体查询来设置...

vue去除全局body的间距

03-08

如果不想单独创建一个新的 CSS 文件，则可以直接在根组件 `App.vue` 内部编写 `<style>` 标签来进行样式覆盖。 ```vue   // ... * { box-sizing: border-box; /* 可选 */ } ...

div设置高度 vue_vue中设置height:100%无效的问题及解决方法

weixin_39640573的博客

12-20

3303

在vue.js中写新的components的时候，如果在新页面中的模板中设置height：100%的时候一直无效。App.vue文件export default {name: 'App'}#app {font-family: 'Avenir', Helvetica, Arial, sans-serif;-webkit-font-smoothing: antialiased;-moz-osx-fon...

Vue 单独给某个页面设置body的css

09-14

1299

【代码】Vue 单独给某个页面设置body的css。

vue在个组件中给body加样式，或者给父级组件元素加样式

S筱潇S四维Smile

03-13

6750

在h5项目中，经常遇到不同组件需要不同背景色，通过vue的生命周期来解决。这组件创建前设置我的样式，销毁之前移除我设置的样式。用以下方式给body添加样式： <script> export default { beforeCreate: function() { document.getElementsByTagName("body")[0].class...

Vue3去除body默认样式，去除白边

2301_80272947的博客

04-18

1554

在项目src目录下新建styles文件夹，在styles下新建reset.scss 的文件将下面的代码复制进去。然后在项目根目录找到index.html，在里面添加代码。在进行Vue3搭建时，默认样式会出现白边。

vue单独给页面设置body属性

weixin_30877755的博客

11-07

4241

因项目需求：用户个人详细信息页面设置背景色，之前在这个页面设置最外层div发现不行。因为app.vue影响了它。后来直接在页面上用body设置样式，发现影响了其他页面。后来想了通过vue的生命周期来解决。这个页面创建前设置我的样式，销毁之前移除我设置的样式。代码如下： //创建前设置 beforeCreate () { document.querySelector('...

【JavaScript】body内的任意节点的自定义属性

编程记录，亲测有效

03-06

2048

在HTML中body内的任意节点是可以自定义属性的，当然不包括body，比如以下的代码： html自定义标签我可以为id为s的行内位置定义一个自定义属性iii，其值为222，很明显的iii根本就不是span元素甚至其他任意一个元素的基本属性，也就是那些id,style,之类的，因此对这个节点内的东西的表现是没有任何影响的，但是这样做又有什么意义呢？这主要是用来提供

2020-11-11 Vue-03动态绑定属性

qq_44805237的博客

11-29

206

14-v-bind <body> <div id="app"> <h2>Mamba :{{name}}</h2> <img v-bind:src="imgURL" alt=""> <a v-bind:href="aHref" alt="">百度一下</a> </div> <script src="../js/vue.js"></script>

【Vue】操作标签元素

Superman_H的博客

02-08

2115

# 数据显示 ## 文本插值 `{{ }}` * 插值符 `{{ }}` 里面可以写 JS 表达式 > #### Vue2 * 插值符 `{{ }}` 可以直接获取 data 中的数据实际上，`{{ }}` 中能直接获取 Vue 实例的所有属性 ```html msg: {{`${msg}!!!`}}

Vue进阶（幺叁捌）：js中document.documentElement 和document.body 以及其属性 clientWidth等

IT全栈华强工作室

08-26

4605

在设计页面时可能经常会用到固定层的位置，这就需要获取一些html对象的坐标以更灵活的设置目标层的坐标，这里可能就会用到document .body.scrollTop等属性，但是此属性在xhtml标准网页或者更简单的说是带标签的页面里得到的结果是0，如果不要此标签则一切正常，那么在xhtml页面怎么获得body的坐标呢，当然有办法-使用document .documentElement来取代document .body,可以这样写例如： var top = document .documentElemen