有两种方法,
这应该是vue编译的规范吧,未在虚拟dom中渲染的元素无法修改样式;
解决方案1:在updated生命周期函数中,js动态配置样式,代码如下
updated() {document.querySelector('.detail img').style.cssText ='width: 100%;'},
解决方案2:单独放在一个style标签里 <style>
.detail img{
width:50px
}
</style>
解决方案3:不推荐使用 去掉style中的scoped 因为子组件会继承父组件的样式,但会影响其它组件的布 局,一般都是先写完静态页面,再渲染数据, 全局样式容易崩,心态就炸了。推荐使用方案2
修改样式的时候,检查下元素,找到相对应的类名,设置样式,如果还是修改不了,可以加 !important
设置优先级为最高
from 小曼很nice