一、先安装引入icon图标的依赖
cnpm install @element-plus/icons-vue
二、复制icon
三、组件的方式使用icon
1)、引入
2)、效果: 出来了一个大图标
3)、代码
<template>
<div id="login">
<Camera/>
</div>
</template>
<script setup>
import { Camera } from "@element-plus/icons-vue";
</script>
三、在input表单中显示图标
1)、引入
2)、效果:
3)、代码
<template>
<div id="login">
<div class="log">sdfsdf</div>
<div class="login-on-register">
<div class="title">
<div class="login-t">登录</div>
<div class="register-t">注册</div>
</div>
<div class="demo-input-suffix">
<div class="label">属性方式:</div>
<div class="input"><el-input placeholder="请输入内容" :prefix-icon= Camera v-model="input2"></el-input></div>
</div>
</div>
</div>
</template>
<script setup>
import { Camera } from "@element-plus/icons-vue";
</script>