美文网首页工作生活
vue报错信息总结

vue报错信息总结

作者: 刘叶青 | 来源:发表于2019-07-01 14:21 被阅读0次

    报错信息:[Vue warn]: The data property"is already declared as a prop. Use prop default value instead

    图片.png

    报错原因:父组件里定义的属性并且通过props传给了子组件,子组件里不要再定义,否则会报错

    报错信息:[Vue warn]: Computed property "reversedMessage" was assigned to but it has no setter.

    图片.png

    报错原因:你没有给计算属性设置set函数,却修改了计算属性的值,解决方案就是:给计算属性加上set函数

    报错信息怎么看?

    图片.png
    图片.png

    命名行里,不同颜色有不同含义,

    白色信息表示普通信息


    图片.png
    蓝色表示正在编译 图片.png
    绿色表示成功 图片.png
    红色表示报错了 图片.png

    报错信息:[Vue warn]: Do not use built-in or reserved HTML elements as component id: b

    图片.png

    报错原因:自定义组件的名称是'b',而'b'是html提供的标签名,自定义组件的名称是不能跟html提供的标签名一致的

    报错信息: <div id="app"> </div> <div class="div2"></div>- Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead.

    图片.png

    报错原因:.vue文件里,template下面必须只有1个子元素


    图片.png

    报错信息:Computed property "full_name" was assigned to but it has no setter.

    图片.png
    报错原因:修改计算属性的值了,但是计算属性没有setter函数,具体代码如下: 图片.png

    报错信息:Module not found: Error: Can't resolve 'Form.vue' in 'C:\projects\web0401\vue\vue_demo1\src\components'

    图片.png

    报错原因:直接写路径,vue会去node_modules里找‘Form.vue’,找不到就报错了,注意:在vue里引入组件,跟平时html里引入js的写法略有区别,如果是当前路径,开始路径要加上'./'

    报错信息:[Vue warn]: Error in v-on handler: "TypeError: "foo" is read-only"

    图片.png

    报错原因:可能是因为对某个对象使用了Object.freeze,导致里面所有的属性不能被改变

    报错信息:[Vue warn]: Property or method "show" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

    found in
    ---> <Subject> at src/components/Subject.vue


    图片.png

    报错原因:你定义了一个变量名字叫'show',但是在data和methods里都找不到
    class的值是一个固定的字符串、class的值是一个变量和一个字符串拼接而成,这2种情况,都可以在下面的截图里找到写法:


    图片.png

    相关文章

      网友评论

        本文标题:vue报错信息总结

        本文链接:https://www.haomeiwen.com/subject/vrugcctx.html