PyCharm警告:结束标记与<p>标记不匹配

时间:2018-09-25 01:00:58

标签: vue.js pycharm code-inspection

在我的PyCharm中检查代码之后。它警告我 关闭标签与最后一个</p>标签不匹配

但是我的代码没有发现任何错误。 p标签已正确关闭。

  <p v-if="files.length">
      <ul>
        <li v-for="file in files">
            {{file.name}} <span v-if="file.success"> - success. </span><span v-if="file.error"> - fail. </span>
            <span v-if="file.success || file.error">{{file.xhr.responseText}}</span>
        </li>
      </ul>
  </p>

如何正确解决此警告?

1 个答案:

答案 0 :(得分:4)

此警告是由无效的HTML引起的。 ul元素中不允许p元素。可以通过重构源以遵循HTML specification来解决警告。

删除p元素:

<ul>
  <li v-for="file in files">
      {{file.name}} <span v-if="file.success"> - success. </span><span v-if="file.error"> - fail. </span>
      <span v-if="file.success || file.error">{{file.xhr.responseText}}</span>
  </li>
</ul>

p元素转换为div元素:

<div v-if="files.length">
  <ul>
    <li v-for="file in files">
        {{file.name}} <span v-if="file.success"> - success. </span><span v-if="file.error"> - fail. </span>
        <span v-if="file.success || file.error">{{file.xhr.responseText}}</span>
    </li>
  </ul>
</div>

答案https://stackoverflow.com/a/5681796中对规范的相关部分进行了很好的总结。请注意,答案专门针对ol而不是ul,但仍然适用,因为它们的类别和内容模型相同。

如果PyCharm警告消息更具体,那就更好了。可以通过自定义检查在PyCharm的付费版本中完成此操作,但在Community Edition中则无法做到。 https://www.jetbrains.com/help/pycharm/creating-custom-inspections.html