<el-image
      style="width: 100px; height: 100px"
      :src="url"
      :fit="fit">
</el-image>
//1.src屬性：圖像的地址，綁定變量用來(lái)指定圖片的地址，通常需要使用require來(lái)拉取圖片
//2.fit屬性：確定圖片如何適應(yīng)到容器框（'fill', 'contain', 'cover', 'none', 'scale-down'）
//3.lazy屬性：圖片懶加載（按需加載）

<el-menu mode="方向" background-color="背景色" text-color="文本顏色" 
         default-active="默認(rèn)打開的菜單" 
         active-text-color="活動(dòng)的菜單的文本的顏色">
    <el-submenu index="1"> //菜單項(xiàng)
            <template slot="title">  //標(biāo)題文本
              <i class="el-icon-notebook-2"></i> //文本前的圖標(biāo)
              <span>在線教材</span>
            </template>
              <el-menu-item index="1-1"> //子菜單項(xiàng)
                <router-link to="/books" class="link">出版圖書</router-link>
              </el-menu-item>
              <el-menu-item index="1-2">教案管理</el-menu-item>
              <el-menu-item index="1-3">教材管理</el-menu-item>
   </el-submenu>
  //disabled屬性：表示該菜單項(xiàng)不可用

<el-upload
            class="avatar-uploader"
            style="margin-left: 30px;"
            drag
            action="http://localhost:8089/books/upload"
            :show-file-list="false"
            :on-change="handlePreview"
            :on-success="handleAvatarSuccess"
            :before-upload="beforeAvatarUpload"
            multiple >
          <img v-if="imageUrl" :src="imageUrl" class="avatar">
          <i class="el-icon-upload"></i>
          <div class="el-upload__text">將圖書圖片拖到此處，或<em>點(diǎn)擊上傳</em></div>
          <div class="el-upload__tip" slot="tip">只能上傳jpg/png文件，且不超過(guò)2M</div>
/el-upload>
 //1.drag屬性：表示是否啟用拖拽上傳 
 //2.action屬性：上傳服務(wù)器的地址
 //3.show-file-list：  是否顯示已上傳文件列表(true/false) 
 //4.data：上傳時(shí)是否需要附帶額外的參數(shù)
 //5.multiple：是否可以上傳多個(gè)文件
 //6.on-change事件：當(dāng)上傳文件的內(nèi)容發(fā)生改變時(shí)觸發(fā)，
 //7.on-success事件：當(dāng)上傳成功后觸發(fā)   
 //8.before-upload事件：在上傳之前觸發(fā)(通常用于檢查上傳文件的格式、大小)  
對(duì)應(yīng)的代碼：
//before-upload事件的處理函數(shù)：圖片上傳之前的驗(yàn)證
    beforeAvatarUpload(file) {
      const isJPG = (file.type === 'image/jpeg'||'image/png');
      const isLt2M = file.size / 1024 / 1024 < 2;
      if (!isJPG) {
        this.$message.error('上傳頭像圖片只能是 JPG 格式!');
        this.imageUrl = ''
      }
      if (!isLt2M) {
        this.$message.error('上傳頭像圖片大小不能超過(guò) 2MB!');
        this.imageUrl = ''
      }
      return isJPG && isLt2M;
    },
    //on-change事件的處理函數(shù)：顯示圖片
    handlePreview(file){
      console.log('#####:',file)
      this.imageUrl = URL.createObjectURL(file.raw)
    },
    //on-success事件觸發(fā)的函數(shù)：圖片上傳成功后
    handleAvatarSuccess(res, file) {
      this.imageUrl = URL.createObjectURL(file.raw);
    },

 <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage4"
      :page-sizes="[100, 200, 300, 400]"
      :page-size="100"
      layout="total, sizes, prev, pager, next, jumper"
      :total="400">
    </el-pagination>

//1.size-change事件：每頁(yè)顯示的記錄數(shù)發(fā)生改變時(shí)觸發(fā)，會(huì)自動(dòng)給事件處理函數(shù)傳遞一個(gè)參數(shù)，參數(shù)值是新的每頁(yè)顯示的記錄數(shù)
//2.current-change事件：當(dāng)前的頁(yè)碼發(fā)生改變時(shí)觸發(fā)，會(huì)自動(dòng)給事件處理函數(shù)傳遞一個(gè)參數(shù)，參數(shù)值是新的頁(yè)碼
//3.current-page屬性：當(dāng)前頁(yè)的頁(yè)碼
//4.page-sizes屬性：每頁(yè)顯示的記錄數(shù)的列表，屬性值是一個(gè)數(shù)組
//5.page-size屬性：當(dāng)前每頁(yè)顯示的記錄數(shù)，屬性值是一個(gè)數(shù)字
//6.layout屬性：分頁(yè)組件的布局
//7.total屬性：總記錄數(shù)