子组件修改父组件样式 vue2

昨天同事碰到一个问题：APP.vue页面中统一设置了导航栏，其他页面只要在路由中添加meta属性即可。但是result.vue页面中需要修改导航栏的某个样式------即涉及到一个子组件修改父组件的问题。
但通过添加样式，一直不生效，chrome中该类的样式中都找不到这个样式，最后通过：dom操作

this.$nextTick(() => {
document.querySelector(‘.container’).style.color = ‘skyblue’
})

昨天查了很久一直找不到这块的文章。回家睡觉突然灵光来了，想到了他的原因：这属于子组件自改父组件的样式问题，网上就查到了一篇沾了点边但是解决不了我的问题

因为vue中子组件添加了scoped属性，无法影响到父组件。

故：有两种方法：
推荐使用第一种：使用：
this.$nextTick(() => {
document.querySelector(‘.container’).style.color = ‘skyblue’
})
这种比较安全；

第二种：如果你修改的那个页面样式简单，且有把握不会影响其他页面样式，就把该页面的scoped去掉即可。

如有问题，欢迎各位老师指正，如有更好的方法求指点。