css - 代码更改后,Vue JS CSS 未在浏览器上更新
问题描述
我的 VUS JS 浏览器遇到一个奇怪的错误。突然,一些 CSS 更改停止在浏览器上更新。我的主页上嵌套了一个简单的 Footer Chid 组件。该组件已在页面上呈现,但 CSS 属性不在浏览器中。
在此处输入图像描述
一些代码:主页
<div class="home">
<header>
<div class="layout">
<div class="logo"></div>
<div class="search">
<router-view name="NavBarSearch"></router-view>
<router-view name="NavBar"></router-view>
</div>
<div class="nav">
<button type="button" id="create" class="btn rounded-pill">Create Diet</button>
</div>
</div>
</header>
<nav id="top">
<div class="layout">
<div class="space"></div>
<div class="main">
</div>
<div class="tabs">
<router-view name="Tabs"></router-view>
</div>
</div>
</nav>
<nav id="left">
<div class="container">
<router-view name="LeftbarNav"></router-view>
</div>
</nav>
<section>
<div id="main">
</div>
<Footer></Footer>
</section>
<aside id="right">
<div class="layout">
<section class="main">
</section>
<footer class="settings">
</footer>
</div>
</aside>
<div class="overlay" :class={active:FullOverlay} v-on:click="mealDetails"></div>
</div>
CHID-组件“页脚”
<template>
<div class="footer">
<div class="left">
</div>
<div class="right">
</div>
</div>
</template>
<script>
import { Calendar, Stepper } from "./";
export default {
name: "Footer",
components: {
Calendar,
Stepper ,
},
data() {
return {};
},
};
</script>
<style lang="scss" scoped>
.footer {
position: sticky;
bottom: 0;
height: 110px;
width: 100%;
display: grid;
background-color: rgb(255, 255, 255);
grid-template-columns: repeat(12, 1fr);
.left {
grid-area: left;
grid-column: span 2;
grid-row: span 2;
background-color: transparent;
// background-color: green;
}
.right {
grid-area: right;
grid-column: span 10;
grid-row: span 2;
background-color: transparent;
// background-color: yellow;
}
}
</style>
解决方案
推荐阅读
- d3.js - d3jsv4 世界图表 - 在地图上突出显示具有相似日期/时间属性的特定国家
- binding - 从 Db 构建多个工具提示
- javascript - 如何在浏览器的 reddit api 中使用 oauth?
- javascript - 递归检查对象字段(+嵌套)为真
- javascript - 将组限制添加到上下文菜单 Odoo
- r - 直接从网页下载并导入文件到 R 环境
- python-3.x - 谷歌云功能完成状态:“连接错误”
- c - 将数组复制到数组数组中,然后写入文件
- spring-transactions - 在 Spring 中使用程序化事务代码覆盖声明性事务方法
- rstudio - 在条形图上添加刻度线和线条