element-ui大总结

element-ui 使用方法主要有4大块，slot ,属性， method和event。刚开始看这个不久，乍一看感觉有很多东西要记住使用。这个就当是做个主题阅读，知道基本的使用规则，快速索引。真正的熟练还是要在项目中多多练习才行，更重要的是有时间的时候，自己造出这些组建，了解后面的思维原理。

slot

<div style="width:800px;">
        <h1 class="mb20">slot</h1>
        <p>1.input slots</p>
        <el-input v-model="input22" placeholder="input prefix 效果">
          <!-- slot :prefix  suffix prepend append  只对type=text 有效-->
          <i slot="prefix" class="el-input__icon el-icon-search"></i>
          <el-button type="primary" slot="prepend">prepend 前置</el-button>
          <el-button type="primary" slot="append">append 后置</el-button>
        </el-input>
        <p>2. Alert slot</p>
        <el-alert title="错误提示的文案" type="error" description="文字说明文字说明文字说明文字说明文字说明文字说明" show-icon>
          <p slot>辅助性文字。同属性description</p>
        </el-alert>
        <p>3.Dropdown Slots
          <br>通过组件slot来设置下拉触发的元素以及需要通过具名slot为dropdown 来设置下拉菜单.
        </p>
        <el-dropdown>
          <span class="el-dropdown-link">
            <el-button type="primary">
              下拉菜单
              <i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item>螺蛳粉</el-dropdown-item>
            <el-dropdown-item>双皮奶</el-dropdown-item>
            <el-dropdown-item>蚵仔煎</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
        <p @click="centerDialogVisible = true">4. dialog Slot
          <!--  匿名  title footer -->
        </p>
        <el-dialog :visible="centerDialogVisible" :append-to-body="true">
          <p slot="title">ti