前端开发中的组件错误与解决方案-优快云博客

本文探讨了前端开发中遇到的常见问题，包括无效的组件名称、未注册的自定义组件以及Dialog组件的遮罩层定位。针对这些问题，提出了相应的解决方案，如遵循HTML5规范命名组件，确保组件注册正确，并利用`:append-to-body`属性调整遮罩层位置。此外，还介绍了如何在Search Everywhere窗口中计算简单的算术表达式，以及自定义滚动条样式的方法。同时，文章提及了代码中避免标识符紧随数字的规则。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.Invalid component name: “2popu-sgjc-jcdm”. Component names should conform to valid custom element name in html5 specification.
无效的组件名称：“2popu-sgjc-jcdm”。组件名称应符合 html5 规范中的有效自定义元素名称。

2.Unknown custom（自定义） element: - did you register the component correctly? For recursive components, make sure to provide the “name” option.
未知的自定义元素： - 您是否正确注册了组件？对于递归组件，请确保提供“名称”选项。

3.dialog遮罩层问题
3.1遮罩层在dialog下面

 <el-dialog
      title="空气质量现状"
      :visible.sync="dialogFormVisible"
      width="80%"
      :append-to-body="true"
    >

在这里插入图片描述

3.1遮罩层在dialog上面

:append-to-body="true"可以解决蒙层问题
4，You can evaluate（估算，计算，求值） simple arithmetical（算术的） expressions（表达） with the Search Everywhere window (Shift twice).
您可以使用 Search Everywhere 窗口（Shift 两次）计算简单的算术表达式。
5.滚动条样式

/*谷歌浏览器下的滚动条样式*/
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}

::-webkit-scrollbar-thumb {
  // border-radius: 5px;
  // -webkit-box-shadow: inset 0 0 5px rgba(202, 225, 253, 1);
  background: rgb(49, 131, 231);
}

// 轨道
::-webkit-scrollbar-track {
  //   -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  //   border-radius: 0;
  //   background: rgba(0, 0, 0, 0.1);
}

/* 功能区下拉选择框 */
.ms-drop ul {
  padding: 0px !important;
}
6.An identifier or keyword cannot immediately follow a numeric literal.
标识符或关键字不能紧跟数字文字。

日迹2022.3.22