英文:
"JSX element 'div' has no corresponding closing tag."
问题
我在运行代码时收到了一个错误消息：
"JSX元素'div'没有对应的闭合标签。"
我正在尝试学习条件加载消息。
你应该做什么？
英文:
I got an error message when I tried to run the code:
"JSX element 'div' has no corresponding closing tag."
I was trying to learn conditional loading message.
return (
<div className="home">
{isPending && <div>Loading...<div/>}
{blogs && <Bloglist blogs={blogs} title="All blogs!"/>}
</div>
);‚
What should I do?
答案1
得分: 2
你在你的HTML中犯了一个错误。你写成了：
{isPending && <div>Loading...<div/>}
而不是：
{isPending && <div>Loading...</div>}
可能是因为你把Bloglist当成了自闭合标签。
如果一个组件被调用时使用了自闭合标签，你应该在闭合括号前面加上/。但是如果你使用两个标签来传递子组件，那么这两个标签必须始终以如下格式进行格式化：
<标签名 ...可能还有一些属性>
HTML内容
</标签名>
我想补充一下，通常当编译器抛出错误时，你会得到很多信息（例如错误发生的文件和行数）。所以当你得到缺少div闭合标签的信息时，解决方案并不难找到。
也许下次你在这里分享一个问题之前，你应该先阅读错误信息并尝试理解你所拥有的信息。
英文:
You've made a mistake in your html.
You wrote this:
{isPending && <div>Loading...<div/>}
instead of this
{isPending && <div>Loading...</div>}
Maybe there is a confusion because you use Bloglist as a self closing tag
If a component is called with a self closing tag, you put the / before the closing bracket, but if you use two tags to pass children inside your component, the two tag must always be formatted like this :
<tagname ...eventually some attributes>
html content
</tagname>
I would add that normally you have a lot of informations when an error is thrown by the compiler (for example the file and the line when the error occured). So when you have the information about the closing tag missing for div, the solution is not that hard to found
Maybe next time you have a problem that you want to share here, you should first read the error and try to understand the informations you have.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论