vue 全局组件改子组件报错

最新推荐文章于 2023-03-06 20:29:16 发布

纸屑丶

最新推荐文章于 2023-03-06 20:29:16 发布

阅读量251

点赞数

文章标签： vue

本文链接：https://blog.csdn.net/weixin_46103337/article/details/104192782

版权

vue 全局组件改子组件报错

今天学习vue组件的时候，将Vue.component(“todo-item”,{…})改写成var todoItem={ … }的时候一直报错：
起初以为是哪里拼写错了，或者是components没注册，就一个字一个字对着老师的代码看，最后看的眼睛都花了没找到问题，就把老师的js代码直接复制粘贴过来发现还是不行，这才发现不是js文件的问题，问题出现在html文件上组件引入的顺序错了。

一开始是这样的：

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="js/vue.js"></script>
    <script src="js/todo.js"></script>
    <script src="js/todo-add.js"></script>
    <script src="js/todo-list.js"></script>
    <script src="js/todo-item.js"></script>
</head>

修改后：

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="js/vue.js"></script>
    <!--子组件一定要在父组件之前引入！-->
    <script src="js/todo-add.js">
    //todo-add是todo的子组件，所以要在todo前引入
    </script>
    <script src="js/todo-item.js">
    //todo-item是todo-list的子组件，要在todo-list前引入
    </script>
    <script src="js/todo-list.js">
    //todo-list和todo-add都是todo的子组件，他两不分先后，都要在todo之前
    </script>
    <script src="js/todo.js">
    </script>
</head>

上网查发现没有相同的错误，犯了这样的错误，耽误了许多时间，在此记下长个记性。

纸屑丶

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vue 全局组件改子组件报错

vue 全局组件改子组件报错今天学习vue组件的时候，将Vue.component(“todo-item”,{…})改写成var todoItem={ … }的时候一直报错：起初以为是哪里拼写错了，或者是components没注册，就一个字一个字对着老师的代码看，最后看的眼睛都花了没找到问题，就把老师的js代码直接复制粘贴过来发现还是不行，这才发现不是js文件的问题，问题出现在html文件上组...
复制链接

扫一扫