工作155:icon图标前置和后置

89 阅读 0 评论 59 点赞

我是靠谱客的博主迷人奇迹，这篇文章主要介绍工作155:icon图标前置和后置，现在分享给大家，希望可以做个参考。

<el-button slot="append"></el-button> 里的 slot="append" 就是一个UI摆放的位置,其实就是封装的样式布局。

append：代表放在紧贴在依赖组件的后面

prepend：代表放在紧贴在依赖组件的前面

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
 <el-form  :model="form" label-width="0px">
          <el-form-item>
            <el-input v-model="form.account">
              <el-button slot="prepend" icon="el-icon-user"></el-button>
            </el-input>
          </el-form-item>
          <!--登录的密码-->
          <el-form-item>
            <el-input v-model="form.password" show-password>
              <el-button slot="prepend" icon="el-icon-lock"></el-button>
            </el-input>
          </el-form-item>