element-ui大总结

element-ui 使用方法主要有4大块，slot ,属性， method和event。刚开始看这个不久，乍一看感觉有很多东西要记住使用。这个就当是做个主题阅读，知道基本的使用规则，快速索引。真正的熟练还是要在项目中多多练习才行，更重要的是有时间的时候，自己造出这些组建，了解后面的思维原理。

slot

        
slot
        
1.input slots
        
          
          
          prepend 前置
          append 后置
        
        
2. Alert slot
        
          
辅助性文字。同属性description
        
        
3.Dropdown Slots
          
通过组件slot来设置下拉触发的元素以及需要通过具名slot为dropdown 来设置下拉菜单.
        
        
          
            
              下拉菜单
              
            
          
          
            螺蛳粉
            双皮奶
            蚵仔煎
          
        
        
4. dialog Slot
          
        
        
          
title标题 slot
          
匿名slot 即是内容模版
          

            取 消
            确 定
          
        
        
5. table slot
        

          
            
            
            
            
              
              
            
          
        
      

Attribute

 
属性（基本在标签上直接展示就可以，⚠️有些属性的前面需要加:，如果自己的代码不生效可以看看是不是忽略了这个小细节）
      
        
          
          
          
        
        
      
      

        

          
          
          
        
      

method

method
      

        
method: 是绑定在DOM上的方法
this.$refs[formName].resetFields();

         this.$refs[formName].validate
         
如table 的

         this.$refs.multipleTable.toggleRowSelection(row);

         this.$refs.multipleTable.clearSelection();
         
        
          
            
          
          
            
              
              
            
          
          
            
              
                
              
            
            -
            
              
                
              
            
          
          
            
          
          
            
              
              
              
              
            
          
          
            
              
              
            
          
          
            
          
          
            立即创建
            重置
          
        
      

submitForm(formName) {
		// form 的validate方法
      this.$refs[formName].validate(valid => {
        if (valid) {
          alert("submit!");
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    resetForm(formName) {
    	// form 的resetFields方法
      this.$refs[formName].resetFields();
    }

event

 
event
      

        event 是直接绑定在标签上是操作