img闭合问题

.eslintrc.js

@@ -7,67 +7,110 @@ module.exports = {
   env: {
     browser: true,
     node: true,
-    es6: true,
+    es6: true
   },
   extends: ['plugin:vue/recommended', 'eslint:recommended'],
 
-
   rules: {
-    "vue/max-attributes-per-line": [2, {
-      "singleline": 10,
-      "multiline": {
-        "max": 1,
-        "allowFirstLine": false
-      }
-    }],
-    "vue/singleline-html-element-content-newline": "off",
-    "vue/multiline-html-element-content-newline":"off",
-    "vue/name-property-casing": ["error", "PascalCase"],
-    "vue/no-v-html": "off",
+    'vue/max-attributes-per-line': [
+      2,
+      {
+        singleline: 10,
+        multiline: {
+          max: 1,
+          allowFirstLine: false
+        }
+      }
+    ],
+    'vue/html-self-closing': [
+      'error',
+      {
+        html: {
+          void: 'always',
+          normal: 'never',
+          component: 'always'
+        },
+        svg: 'always',
+        math: 'always'
+      }
+    ],
+    'vue/singleline-html-element-content-newline': 'off',
+    'vue/multiline-html-element-content-newline': 'off',
+    'vue/name-property-casing': ['error', 'PascalCase'],
+    'vue/no-v-html': 'off',
     'accessor-pairs': 2,
-    'arrow-spacing': [2, {
-      'before': true,
-      'after': true
-    }],
+    'arrow-spacing': [
+      2,
+      {
+        before: true,
+        after: true
+      }
+    ],
     'block-spacing': [2, 'always'],
-    'brace-style': [2, '1tbs', {
-      'allowSingleLine': true
-    }],
-    'camelcase': [0, {
-      'properties': 'always'
-    }],
+    'brace-style': [
+      2,
+      '1tbs',
+      {
+        allowSingleLine: true
+      }
+    ],
+    camelcase: [
+      0,
+      {
+        properties: 'always'
+      }
+    ],
     'comma-dangle': [2, 'never'],
-    'comma-spacing': [2, {
-      'before': false,
-      'after': true
-    }],
+    'comma-spacing': [
+      2,
+      {
+        before: false,
+        after: true
+      }
+    ],
     'comma-style': [2, 'last'],
     'constructor-super': 2,
-    'curly': [2, 'multi-line'],
+    curly: [2, 'multi-line'],
     'dot-location': [2, 'property'],
     'eol-last': 2,
-    'eqeqeq': ["error", "always", {"null": "ignore"}],
-    'generator-star-spacing': [2, {
-      'before': true,
-      'after': true
-    }],
+    eqeqeq: ['error', 'always', { null: 'ignore' }],
+    'generator-star-spacing': [
+      2,
+      {
+        before: true,
+        after: true
+      }
+    ],
     'handle-callback-err': [2, '^(err|error)$'],
-    'indent': [2, 2, {
-      'SwitchCase': 1
-    }],
+    indent: [
+      2,
+      2,
+      {
+        SwitchCase: 1
+      }
+    ],
     'jsx-quotes': [2, 'prefer-single'],
-    'key-spacing': [2, {
-      'beforeColon': false,
-      'afterColon': true
-    }],
-    'keyword-spacing': [2, {
-      'before': true,
-      'after': true
-    }],
-    'new-cap': [2, {
-      'newIsCap': true,
-      'capIsNew': false
-    }],
+    'key-spacing': [
+      2,
+      {
+        beforeColon: false,
+        afterColon: true
+      }
+    ],
+    'keyword-spacing': [
+      2,
+      {
+        before: true,
+        after: true
+      }
+    ],
+    'new-cap': [
+      2,
+      {
+        newIsCap: true,
+        capIsNew: false
+      }
+    ],
     'new-parens': 2,
     'no-array-constructor': 2,
     'no-caller': 2,
@@ -98,17 +141,23 @@ module.exports = {
     'no-irregular-whitespace': 2,
     'no-iterator': 2,
     'no-label-var': 2,
-    'no-labels': [2, {
-      'allowLoop': false,
-      'allowSwitch': false
-    }],
+    'no-labels': [
+      2,
+      {
+        allowLoop: false,
+        allowSwitch: false
+      }
+    ],
     'no-lone-blocks': 2,
     'no-mixed-spaces-and-tabs': 2,
     'no-multi-spaces': 2,
     'no-multi-str': 2,
-    'no-multiple-empty-lines': [2, {
-      'max': 1
-    }],
+    'no-multiple-empty-lines': [
+      2,
+      {
+        max: 1
+      }
+    ],
     'no-native-reassign': 2,
     'no-negated-in-lhs': 2,
     'no-new-object': 2,
@@ -136,62 +185,93 @@ module.exports = {
     'no-undef-init': 2,
     'no-unexpected-multiline': 2,
     'no-unmodified-loop-condition': 2,
-    'no-unneeded-ternary': [2, {
-      'defaultAssignment': false
-    }],
+    'no-unneeded-ternary': [
+      2,
+      {
+        defaultAssignment: false
+      }
+    ],
     'no-unreachable': 2,
     'no-unsafe-finally': 2,
-    'no-unused-vars': [2, {
-      'vars': 'all',
-      'args': 'none'
-    }],
+    'no-unused-vars': [
+      2,
+      {
+        vars: 'all',
+        args: 'none'
+      }
+    ],
     'no-useless-call': 2,
     'no-useless-computed-key': 2,
     'no-useless-constructor': 2,
     'no-useless-escape': 0,
     'no-whitespace-before-property': 2,
     'no-with': 2,
-    'one-var': [2, {
-      'initialized': 'never'
-    }],
-    'operator-linebreak': [2, 'after', {
-      'overrides': {
-        '?': 'before',
-        ':': 'before'
-      }
-    }],
+    'one-var': [
+      2,
+      {
+        initialized: 'never'
+      }
+    ],
+    'operator-linebreak': [
+      2,
+      'after',
+      {
+        overrides: {
+          '?': 'before',
+          ':': 'before'
+        }
+      }
+    ],
     'padded-blocks': [2, 'never'],
-    'quotes': [2, 'single', {
-      'avoidEscape': true,
-      'allowTemplateLiterals': true
-    }],
-    'semi': [2, 'never'],
-    'semi-spacing': [2, {
-      'before': false,
-      'after': true
-    }],
+    quotes: [
+      2,
+      'single',
+      {
+        avoidEscape: true,
+        allowTemplateLiterals: true
+      }
+    ],
+    semi: [2, 'never'],
+    'semi-spacing': [
+      2,
+      {
+        before: false,
+        after: true
+      }
+    ],
     'space-before-blocks': [2, 'always'],
     'space-before-function-paren': [2, 'never'],
     'space-in-parens': [2, 'never'],
     'space-infix-ops': 2,
-    'space-unary-ops': [2, {
-      'words': true,
-      'nonwords': false
-    }],
-    'spaced-comment': [2, 'always', {
-      'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']
-    }],
+    'space-unary-ops': [
+      2,
+      {
+        words: true,
+        nonwords: false
+      }
+    ],
+    'spaced-comment': [
+      2,
+      'always',
+      {
+        markers: ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']
+      }
+    ],
     'template-curly-spacing': [2, 'never'],
     'use-isnan': 2,
     'valid-typeof': 2,
     'wrap-iife': [2, 'any'],
     'yield-star-spacing': [2, 'both'],
-    'yoda': [2, 'never'],
+    yoda: [2, 'never'],
     'prefer-const': 2,
     'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
-    'object-curly-spacing': [2, 'always', {
-      objectsInObjects: false
-    }],
+    'object-curly-spacing': [
+      2,
+      'always',
+      {
+        objectsInObjects: false
+      }
+    ],
     'array-bracket-spacing': [2, 'never']
   }
 }

src/views/index.vue

@@ -12,23 +12,23 @@
     <!-- 智慧书架导航 -->
     <ul class="book-nav">
       <li>
-        <img src="~@/assets/images/home/nav1.png">
+        <img src="~@/assets/images/home/nav1.png" />
         <p>图书检索</p>
       </li>
       <li @click="toPath('/HotBook?bookType=hot')">
-        <img src="~@/assets/images/home/nav2.png">
+        <img src="~@/assets/images/home/nav2.png" />
         <p>热门图书</p>
       </li>
       <li @click="toPath('/AuthorRecommend')">
-        <img src="~@/assets/images/home/nav3.png">
+        <img src="~@/assets/images/home/nav3.png" />
         <p>作者推荐</p>
       </li>
       <li @click="toPath('/DigitalResource')">
-        <img src="~@/assets/images/home/nav4.png">
+        <img src="~@/assets/images/home/nav4.png" />
         <p>数字资源</p>
       </li>
       <li>
-        <img src="~@/assets/images/home/nav5.png">
+        <img src="~@/assets/images/home/nav5.png" />
         <p>场馆导航</p>
       </li>
     </ul>
@@ -41,7 +41,7 @@
           </svg>
           <p>本架图书</p>
         </div>
-        <span class="more" @click="toPath('/CurrentRackBook')">更多<i class="iconfont icon-zuo rotate" /></span>
+        <span class="more" @click="toPath('/CurrentRackBook')">更多<i class="iconfont icon-zuo rotate"></i></span>
       </div>
       <div class="rack-list">
         <BookListItem :list-data.sync="rackList" />
@@ -54,7 +54,7 @@
         <div class="list-top-title">
           <p>新书推荐</p>
         </div>
-        <span class="more" @click="toPath('/NewBook?bookType=new')">更多<i class="iconfont icon-zuo rotate" /></span>
+        <span class="more" @click="toPath('/NewBook?bookType=new')">更多<i class="iconfont icon-zuo rotate"></i></span>
       </div>
       <BookListItem :list-data.sync="newList" :is-new-book="true" />
     </div>

src/views/module/bookDetails.vue

@@ -10,7 +10,7 @@
         <div v-if="bookData" class="book-details-box">
           <div class="book-details">
             <div class="book-cover">
-              <img :src="bookData.srcUrl ? bookData.srcUrl : ''" :onerror="defaultImg">
+              <img :src="bookData.srcUrl ? bookData.srcUrl : ''" :onerror="defaultImg" />
             </div>
             <div class="book-desc">
               <h3>{{ bookData.bookName }}</h3>

src/views/module/bookList.vue

@@ -2,7 +2,7 @@
   <div v-loading.fullscreen.lock="bookLoading" class="hotbook-box" @scroll="lazyLoading">
     <div v-if="bookList.length > 0" class="most-book" @click="handleDetails(0)">
       <div class="most-book-img">
-        <img :src="bookData[0].cover ? bookData[0].cover : ''" :onerror="defaultImg">
+        <img :src="bookData[0].cover ? bookData[0].cover : ''" :onerror="defaultImg" />
       </div>
       <div class="most-book-txt book-rack">
         <div class="txt">
@@ -27,7 +27,6 @@
 
 <script>
 import BookDetails from './bookDetails.vue'
-import { } from '@/api/bookshelf'
 import { bookListCrud } from '../mixins/booklist.js'
 export default {
   name: 'BookList',