m0_66970349的博客

做手机端项目时，我们经常遇到flex弹性布局，使用flex:1的作用是让项目能够自动填充剩余空间，实现自适应布局。flex:1是flex-grow:1,flex-shrink:1,flex-basis:0%的缩写。flex 是 flex-grow、flex-shrink、flex-basis三个属性的缩写。（n为正整数）：相当于 flex: n 1 0%，表示项目的放大比例为n，其他值默认。的相对比例,剩余空间是 flex 容器的大小减去所有 flex 项加起来的大小。1.flex:n (n为数字)

此法适用于sass或less的样式穿透，两者方法均可。如果觉得去掉上面的scoped属性怕影响其他布局。如图，红色边框生效，但是最后也有一个，后面我们演示一下如何去掉。最后，效果如图，这样可以在组件原基础上进行覆盖和重新设置。Vant组件默认的设置如下，显示的是中间和下面的灰色边框。使用Vant等组件时，需要在局部组件中修改他们的样式。2.2 使用 /deep/ 或 :(deep)具体原因不太清楚，去掉就有效果，加上就没有效果。我设置的代码如下:可是页面没有任何变化。组件中间添加一个红色隔离边框。

刚好做黑马头条demo时，发现按照视频操作，出现下面问题，点击切换第一个图标一直高亮，且再次点击切换第一个点不了,其他的没问题。定义v-model 的active的值,防止其他页面刷新高亮回到首页，需要根据路由切换不同的active的值。在layout.vue页面 to属性由默认 ' ' 更改为 'home'不用忘记在路由页面定义 子路由的active属性。删除route，添加v-model。1. 父路由添加重定向。