继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

Element 的学习

qq_安之虚静于幻_0
关注TA
已关注
手记 51
粉丝 8
获赞 87

Element 的内置动画
fade 淡入淡出:el-fade-in-linear,el-fade-in
zoom 缩放:el-zoom-in-center,el-zoom-in-top,el-zoom-in-bottom
collapse 展开折叠
使用 el-collapse-transition 组件实现折叠展开效果

<template>
  <div>
    <el-button @click="show3 = !show3">Click Me</el-button>

    <div style="margin-top: 20px; height: 200px;">
      <el-collapse-transition>
        <div v-show="show3">
          <div class="transition-box">el-collapse-transition</div>
          <div class="transition-box">el-collapse-transition</div>
        </div>
      </el-collapse-transition>
    </div>
  </div>
</template>


el-radio:单选框
el-radio-group:单选框组
el-checkbox:复选框
el-checkbox-group:多选框组
el-input :输入框
el-input-number:输入计数器、
el-select:下拉框
el-cascader:级联选择器
el-switch:开关
el-slider:slider滑块
el-time-select:固定时间选择器
el-time-picker:任意时间选择器
el-date-picker:日期时间选择器
el-upload:上传组件
el-rate:评分
el-color-picker:颜色选择器
el-transfer :穿梭框
el-form:表单
el-table:表格
el-tag:标签
el-progress:进度条
el-tree:树形控件
el-pagination:分页
el-badge:Badge 标记,出现在按钮、图标旁的数字或状态标记。
el-menu:导航菜单
el-tabs:标签页
el-breadcrumb:面包屑
el-dropdown:下拉菜单
el-steps:步骤条
el-dialog:对话框
el-tooltip:文字提示
el-popover:文字提示
el-card:卡片
el-carousel:走马灯
el-collapse:折叠面板
el-alert :警告
message:消息提示
Loading :加载
MessageBox :弹框
Notification :通知
打开App,阅读手记
2人推荐
发表评论
随时随地看视频慕课网APP