6.21(vue-cli)

博客内容讲述了在Vue项目中遇到组件未定义的问题,通过新建项目、对比代码、逐步排查,发现是school组件的script标签未闭合导致的问题。修复后,组件能够正常引用和执行,验证了问题的根源在于组件的暴露方式。在整个过程中,作者展现了清晰的思考逻辑和问题解决能力。
摘要由CSDN通过智能技术生成

报错显示未定义为由。
新创建一个项目。对比其中的代码。

采取在项目二中修改项目的方法尝试能否成功引用vue 
关闭语法检查后,调用原来的hello world组建仍然能成功引用应用。
尝试删除使用hello我的图片。
删除应用组件代码无报错。
页面显示解析后的结果。
删除引入代码无报错。页面V有未定义。
重新粘贴代码view定义回来了。

删除注册组件代码无报错页面有定义。

引入两个组件,代码无报错,页面无定义。删除该代码无报错无定义。
引入一个组件,无报错无定义。

更改组件名依然存在,引入组件后无定义情况。证明了定义的结果取决于引入的情况。

尝试删减hello world。使其成为自定义组件的样式。在这个过程中检验页面的定义情况。


哈罗沃的组件实质上与school组建内容无异。完全可以正常运行,实现正常功能。

尝试思故组件正常实现功能。将哈罗word组件中的内容完全复制粘贴到4部组件中,4部组件可以被正常引用了。

之前引入student和school组建的时候就会出现报错。也就是未定义。并且还是在未注册和使用的情况下。

当我更改了hello world的组件。使其内容和school一致后。再重新引入student和school组件,反而没有出现报错,一切都正常无误。
?!意识决定物质?!

Student代码完全可以正常执行。 School的组件代码。

只有一种可能就是student代码本来就没有问题,有问题的是school的代码,在我一开始引入的时候是两个一起引入的,所以没有把它们区分开。

现在school的代码。正常引入注册并使用后,在页面上只能呈现部分效果,就说明了这个问题。

也就是说事故代码中存在问题。通过through代码和hello world代码相对比找出问题。

对比后发现,school代码。没有写完script的标签,也就是整个script标签里的内容,完全没有发挥作用。当补全了script的标签之后,所有页面里的所有东西全部消失了,也显示未定义。
剪切走school中的script代码,先补全script标签,然后逐一往里面添加内容。
猜测可能是数据名的重复。导致系统整个崩溃了。

改变暴露组件的语法后没有任何问题,数据名重复也没有任何问题。目前问题主因已经解决。

整体梳理。
由于school组件中暴露写法,使得school组件一旦被引用或使用都会造成 VUE未定义的状态。

我一开始的思路很正确,重新创建一个项目相互对比。查找问题成因。

然后我逐一将两个项目的代码文件进行比对。使项目二贴近项目一。在这个过程中我筛选过了,mean点js文件开始,谁选APP点view文件。

也正是在这个过程中我发现了,大量的报错是由于代码检查造成的,同时关闭代码检查也不影响view的定义。然后只保留了hello world的引入代码。这个时候让我发现了,引入两个自定义组件,本身就能使整个页面瘫痪。是will陷入未定义的状态。

那么顺理成章的我断定一定是由于自定义组件和hello world组件之间的区别导致了这些。我开始修改hello world组建贴合school组建中的内容。并注册和使用hello world组件,使其呈现school组件的功能。结果一直修改到它完全呈现出了school组件中的功能依然可以被正常使用。同时引入此部组件和student组件是不报错了。陷入了非常吊诡的局面。修改一个文件,居然影响到了毫不相关的另外两个文件吗?

事实是student组建一直都没有问题,之所以引入事因为有school组建。同时students组建也在页面中,正常的显示功能没有任何问题。这个时候school组件在页面中只能显示部分代码。 Script相关的代码完全没用。经检查发现school标签没有写全。可是一旦写全就会是will陷入未定义的状态。整个页面崩溃。

说明了没有写全,就是school组件可以正常引入的原因,同时之前不能正常引入就是因为写全了,而他没有写全,很可能是因为在屡次的修改代码过程中遗失了。

为什么script中的代码有这么大的杀伤力呢? Script代码和其他文件中script的代码究竟有什么区别呢?就是暴露组件的写法有区别。至此问题发现,经检验确实如此问题解决。

在这个过程中,我的思维逻辑很清晰,做出来的推理也很正确,一步一步的排除错误的观点,走向正确的道路,在这个过程中坚定不移。不屈不挠,客观理智的分析问题,解决问题,最终找到了正确的道路。靠自己的能力解决了问题。我相信在边城的路上还会遇到许许多多这样的时刻。在人生的道路中也会有很多艰难困苦的时候。只有坚定信念,永不放弃,只要思想不滑坡,办法总比困难多


 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值