当前位置:   article > 正文

报错[Vue warn]: $listeners is readonly. $attrs is readonly.怎么解决?

$attrs is readonly.

代码也没有逻辑错误,但是报错

[Vue warn]: $listeners is readonly. $attrs is readonly.

情况1:多处声明了new Vue,解决方案:删除一个,用全局变量引用同一个Vue

情况2:import Vue from 'Vue';第二个Vue首字母不要大写,vue即可

import Vue from 'vue';

情况3:在使用多层级组件的时候,出现了A组件调用B组件,B组件再调用了C组件。直接使用了A组件修改了C组件的数据,这个不合法的。

具体解决办法:

在B组件中嵌入C组件的时候这么写

<C v-bind="$attrs" v-on="$listeners"></C>

<!-- 通过v-on绑定$listeners事件,A组件能越过B组件直接监听获取C组件触发的事件 -->

<!-- 通过v-bind绑定$attrs属性,C组件能越过B组件直接获取到A组件中传递下来的props(除了B组件中props声明的) -->

这样,就实现了A→B→C跳跃式监听事件和传参。

当然也可以用Vuex解决这个问题。【高效】极致简化vuex.js(仅需6行代码),让快速敏捷开发不是梦!_rvsxjs-CSDN博客文章浏览阅读293次。前情提示:有一天,我要实现一个效果→点击某个按钮改变一个全局变量,并且要让绑定了该变量的所有位置异步渲染。我试过用一个全局的js文件存放该变量,值虽然该变量了,但是没有做到异步渲染。还没打开页面给我报错 全局变量 of undefined,我才想起页面还没加载完的时候window全局对象都是空值!我看了官方文档,也看了很多论坛大牛的博客,发现大家都在src下面创建一个sotre._vuex.js。只需创建一个vuex.js文件,让你马上学会使用Vuex,尽管Vuex是个鸡肋!_rvsxjshttps://blog.csdn.net/qq_37860634/article/details/131741966

 

情况4:组件库的package.json中dependencies包含了vue包,然后导致最后打包出来的组件库也包含vue包,然后和引用这个组件库的项目中的vue发生冲突。

举个例子,project1是vue组件库,package.json中dependencies包含了"vue":“2.6.1”
project1打包出了"project1":“0.0.1” 这个组件包
然后project2是项目代码,package.json中dependencies包含了"vue":“2.6.1"和"project1”:“0.0.1”
这样,在使用project1的组件时就会出现readonly错误

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/Cpp五条/article/detail/359196
推荐阅读
相关标签
  

闽ICP备14008679号