react入门基础——名字之间的关联

发布时间:2019-06-15 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了react入门基础——名字之间的关联脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

刚刚学习react时教程里的创建文件、组件、路由、demo、class名等等,这些命名时都喜欢起同样的名字,比如PRoducts,然后一上来就特别懵。这些名字都一样,到底之间有什么关联呢?哪里可以改动?那里不可以?
于是简单理解并尝试后,大概记录下来,算是笔记吧。后续若还有类似问题会补充进来。

创建路由

路由可视为组成应用的不同页面,创建routes/ProductsFile.js ,如下图:
图片描述



在router.js中配置路由表(加入红框标出的两行),如下图:
图片描述

名字之间的关联

接下来,在此处来尝试搞清楚众多命名之间的关系。
首先,创建的文件名字要和路由中import引入的路径名字一致,ProductsFile,如下图:

react入门基础——名字之间的关联




组件名字随意命名,在其内部保持声明一致,ProductsName,如下图:

react入门基础——名字之间的关联




路由表中,也就是router.js文件中,引入时可对引入的文件(组件)重新命名,但要和后续使用时要保持名字一致,ProductsFree,如下图:

react入门基础——名字之间的关联




最后需要注意一个路径,也就是访问路径时浏览器中地址栏处的名字,ProductsKey,如下图:

react入门基础——名字之间的关联



脚本宝典总结

以上是脚本宝典为你收集整理的react入门基础——名字之间的关联全部内容,希望文章能够帮你解决react入门基础——名字之间的关联所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。