结合element plus 实现35个按钮
时间: 2023-10-26 20:12:24 浏览: 83
以下是结合element plus实现35个按钮的代码示例:
```html
<template>
<div>
<el-button>Default</el-button>
<el-button type="primary">Primary</el-button>
<el-button type="success">Success</el-button>
<el-button type="warning">Warning</el-button>
<el-button type="danger">Danger</el-button>
<el-button type="info">Info</el-button>
<el-button type="text">Text</el-button>
<el-button type="success" icon="el-icon-check">Success</el-button>
<el-button type="danger" icon="el-icon-delete">Danger</el-button>
<el-button type="warning" icon="el-icon-warning">Warning</el-button>
<el-button type="info" icon="el-icon-information">Info</el-button>
<el-button type="primary" icon="el-icon-plus">Add</el-button>
<el-button type="primary" icon="el-icon-edit">Edit</el-button>
<el-button type="primary" icon="el-icon-delete">Delete</el-button>
<el-button type="primary" icon="el-icon-search">Search</el-button>
<el-button type="primary" icon="el-icon-setting">Setting</el-button>
<el-button type="primary" icon="el-icon-refresh">Refresh</el-button>
<el-button type="primary" icon="el-icon-upload2">Upload</el-button>
<el-button type="primary" icon="el-icon-download">Download</el-button>
<el-button type="primary" icon="el-icon-loading">Loading</el-button>
<el-button type="primary" icon="el-icon-check">Approve</el-button>
<el-button type="primary" icon="el-icon-close">Reject</el-button>
<el-button type="primary" icon="el-icon-circle-check">Confirm</el-button>
<el-button type="primary" icon="el-icon-circle-close">Cancel</el-button>
<el-button type="primary" icon="el-icon-menu">Menu</el-button>
<el-button type="primary" icon="el-icon-arrow-left">Prev</el-button>
<el-button type="primary" icon="el-icon-arrow-right">Next</el-button>
<el-button type="primary" icon="el-icon-arrow-up">Up</el-button>
<el-button type="primary" icon="el-icon-arrow-down">Down</el-button>
<el-button type="primary" icon="el-icon-s-check">Save</el-button>
<el-button type="primary" icon="el-icon-s-release">Release</el-button>
<el-button type="primary" icon="el-icon-s-promotion">Promote</el-button>
<el-button type="primary" icon="el-icon-s-home">Home</el-button>
<el-button type="primary" icon="el-icon-s-flag">Flag</el-button>
<el-button type="primary" icon="el-icon-s-custom">Custom</el-button>
<el-button type="primary" icon="el-icon-s-opportunity">Opportunity</el-button>
<el-button type="primary" icon="el-icon-s-data">Data</el-button>
</div>
</template>
```
在上面的代码中,我们使用了35个不同的按钮,每个按钮都有一个不同的图标和类型。这些按钮可以用于各种目的,例如添加、编辑、删除、搜索、设置、刷新、上传、下载、审批等等。这些按钮可以根据需要进行自定义,并且可以与其他element plus组件一起使用,以创建功能强大的Web应用程序。
阅读全文