如何计算<；车身>；或<；html>；使用vue.js？

我使用在计算样式时动态渲染更改

这对我的Vue实例范围内的所有内容都非常有效，但是如何计算主体或html标记的样式呢？ 当您可以将vue实例绑定到，但vue不再允许您这样做时，这一点以前是可能的

我想在vue中使用我的计算变量动态更新背景颜色

编辑：添加代码片段以演示

var-app=新的Vue({
el:“#应用程序”，
数据：{
颜色：“#666666”
},
计算：{
背景颜色：函数（）{
返回{
“背景色”：此颜色为
}
}
},
方法：{
toggleBackground:function（）{
if（this.color='#666666'）{
this.color='#BDBDBD'
}否则{
this.color='#666666'
}
}
}
})

很多内容。。。
单击以切换

如果您真的需要设计

主体本身的样式，那么您需要在
观察器中使用纯JavaScript来完成。下面是一个简单的例子

您应该（不是我尝试过的，但我假设）能够通过使身体和外部容器不滚动来克服过度滚动的影响。在里面放一个可滚动的容器。当它翻滚时，它会显示你的外容器，对吗

不绑定到
主体的原因有（对于React，但适用于Vue）

有什么问题吗？每个人都更新它！有些人有
将modals附加到它的非[Vue]代码。谷歌字体加载器将
快乐地将元素放入体内，持续几秒钟，然后
如果你的应用程序试图更新，它将以可怕的方式莫名其妙地崩溃
在这段时间里最高层的东西。你真的知道吗
你所有的第三方脚本都在做什么？广告或者社交网站呢
网络SDK


newvue({
el:“#应用程序”，
数据：{
伊斯雷德：错
},
观察：{
isRed（）{
document.querySelector（'body'）.style.backgroundColor=this.isRed？'red'：null；
}
}
});
#应用程序{
背景色：白色；
保证金：3rem；
}
我想我找到了比使用jQuery/querySelector更好的解决方案

您可以在Vue模板中添加标记样式。
在这个上面加上v-if，像这样：

<style v-if="true">
  body {
    background: green;
  }
</style>


身体{
背景：红色；/*还有一个好处——你可以写“背景：{{{color}}；”（计算）*/
}
您能给我们看一些代码吗：）？添加了代码片段。如果将
html{background color:red；}
粘贴到css列中，则可以看到问题。vue实例之外的区域不能由vue设置样式。为什么不干脆从html和正文标记中删除填充和边距？许多浏览器允许“过度浏览”效果。这很难描述，但即使div是全屏的（我可以用css修复），您仍然可以通过滚动反弹效果看到html/主体背景颜色。例如，在mac触摸板上用两个手指滚动到页面底部。“反弹”效果显示底层背景色。您可以做的一件事是确保放置id=“app”的div覆盖整个可视页面。使用这个div，就好像它是页面的body标签一样。一切都发生在它里面。然后，你可以在这个div上做任何你想做的事情，就好像它只是一个body标签一样。你能在javascript观察器上提供一个快速的例子来帮助将来可能有同样问题的其他人吗？我添加了一个最小的例子。