【项目实践-03】实验室PC

 透传属性

        透传属性指组件在使用的时候，作用在组件上的属性，会被向下流动，绑定到组件内的标签中。 

        可以透传的属性：style，class，id，属性，事件

        当一个组件有多个根标签节点时，那么这个组件就不会有自动透传绑定属性行为

        所以如果想利用组件的透传，就必须保证组件内部只有一个根标签 

问题：在实验室项目pc端中想利用 v-hasPermi 为导入按钮增加权限，但发现加了权限之后并未生效，导入组件(SyImport) 代码如下：

    
      {{ props.label }}
    
    
      

        

          

            

              导入说明:
              

                {{ props.explain }}
              
            
            

              点击下载导入模板
            
          
          

            
              
                
              
              

                拖拽文件到此 或者 点击此处上传
              
              
            
          
        
        

          
            确认导入
          
        
      
    

由此可看出：组件内部有多个根标签，Vue 不知道为哪个标签绑定透传属性，所以v-hasPermi不会生效。

修改：在组件内部添加一个根标签，将这两个标签都放在根标签里，由此问题解决。