ElementUI组件：Button 按钮

• 算法结构

ElementUI安装与使用指南

Button按钮

点击下载learnelementuispringboot项目源码

效果图

在这里插入图片描述

el-button.vue（Button 按钮）页面效果图

在这里插入图片描述

项目里el-button.vue代码

export default {
  name: "el_button",// 注意这里的名称不能和 router inex.js里的name一样
  methods: {
    sendMsg() {
      // alert(1)x
      this.tipText = "加载中"
      this.loading = true;
      setTimeout(() => {
        this.loading = false
        this.tipText = "加载完毕"
      }, 3000);
    }
  },
  data() {
    return {
      loading: false,
      tipText: ""
    }
  }
}




  
  
    
      
element组件：el-button

      
      
      
      按钮
      搜索
    
    <!--    
-->
    <!--    
-->
    
    
    
      基础用法 type
      默认按钮
      主要按钮
      成功按钮
      信息按钮
      警告按钮
      危险按钮
    
    

    


    
      朴素按钮 plain
      主要按钮
      成功按钮
      信息按钮
      警告按钮
      危险按钮
    
    

    


    
      圆角 round
      圆角按钮
      主要按钮
      成功按钮
      信息按钮
      警告按钮
      危险按钮
    
    

    


    
      圆形 circle
      
      
      
      
      
      
    
    

    


    
      禁用状态 disabled
      默认按钮
      主要按钮
      成功按钮
      信息按钮
      警告按钮
      危险按钮
    
    

    


    
      图标按钮
      
      
      
      搜索
      上传
    
    

    


    
      
        按钮组
      
      
        
          上一页
          下一页
        
      
    
    

    


    
      加载中
      <!--      加载中-->
      
      {{ tipText }}
      发送

    
    

    


    
      不同尺寸 medium、small、mini，通过设置size属性来配置它们
      默认按钮
      中等按钮
      小型按钮
      超小按钮

欢迎关注我的公众号，不定期推送优质的文章，

微信扫一扫下方二维码即可关注。

在这里插入图片描述

本文来自网络，不代表协通编程立场，如若转载，请注明出处：https://www.net2asp.com/085c1e9437.html

赞 (0)
« 上一篇 1天前
下一篇 » 1天前

相关推荐