汽车网站页面布局设计,外链工具下载,网站建设仿站,制作网站的程序语言目录 前言1. 未使用自闭合标签2. 事件名连字符3. 换行符4. 弃用.sync 前言
以下文章实时更新#xff0c;主打记录差异
1. 未使用自闭合标签 104:7 error Require self-closing on Vue.js custom components (el-table-column) vue/html-self-closing✖ 1 problem… 目录 前言1. 未使用自闭合标签2. 事件名连字符3. 换行符4. 弃用.sync 前言
以下文章实时更新主打记录差异
1. 未使用自闭合标签 104:7 error Require self-closing on Vue.js custom components (el-table-column) vue/html-self-closing✖ 1 problem (1 error, 0 warnings)1 error and 0 warnings potentially fixable with the --fix option.截图如下 出现这类Bug是因为
Vue.js 代码中使用的 el-table-column 组件未使用自闭合标签违反 vue/html-self-closing 规则
大致如下
el-table v-loadingloading :datalist :stripetrue :show-overflow-tooltiptrue selection-changehandleSelectionChangeel-table-column typeselection width55 aligncenter/el-table-columnel-table-column label船代码 aligncenter propshipCode /el-table-column typeselection width55 aligncenter /2. 事件名连字符
示例如下
FileForm reffileFormRef :appointment-idformData.id :form-typeformType update:totalItemCounttotalItemCount $event/会出现如下信息149:90 warning v-on event update:totalItemCount must be hyphenated vue/v-on-event-hyphenation
截图如下 原理如下 Vue3 要求在模板中使用事件时事件名必须是连字符 (kebab-case) 风格。为了修复这个警告可以将事件名从 update:totalItemCount 更改为 update:total-item-count
最终修正如下
EnterSiteForm refenterSiteFormRef :appointment-idformData.id :form-typeformTypeupdate:total-item-counttotalItemCount $event/3. 换行符
出现如下问题 113:22 warning Expected a linebreak before this attribute vue/first-attribute-linebreak✖ 1 problem (0 errors, 1 warning)0 errors and 1 warning potentially fixable with the --fix option.截图如下 原理如下vue/first-attribute-linebreak 规则要求在 Vue 组件的第一个属性之前应有一个换行符以提高代码的可读性和一致性
源代码如下 修正如下 4. 弃用.sync
出现如下问题 251:14 error .sync modifier on v-bind directive is deprecated. Use v-model:propName instead vue/no-deprecated-v-bind-sync255:11 error slot attributes are deprecated vue/no-deprecated-slot-attribute✖ 2 problems (2 errors, 0 warnings)2 errors and 0 warnings potentially fixable with the --fix option.截图如下 原理如下 已弃用的 .sync 修饰符和 slot 属性 可以改用 v-model:propName 代替 .sync并使用插槽的现代语法
源代码如下 修正结果如下