导航

关于组件

Posted on 2023-02-10 16:00  随风而来丶  阅读(22)  评论(0)    收藏  举报

一、组件传值的方式;

      1、父传子/孙;

             

                   3、依赖注入;provide/inject

                   

 

                  父中加入provide();
                  

 

                 孙组件中直接使用;inject;

                

 

               缺点找起来费劲;

          

      2、子传父;

           $refs===>ref;
           用来获取DOM;
           

 

            

      
      3、兄弟直接传递;

           

 

          兄弟节点BUS的使用;
         使用实例:

              

 

              

 

              用BUS进行中转;

 


二、父组件直接修改子组件的值;

          

 

 


三、子组件直接修改父组件的值;

     

 

 


四、如何找到父组件;

    

 

 


五、如何找到根组件;

       

 

 

         所对应的找到父组件;与值对应的找到根组件;

    

 

 


六、keep - alive 
        用于缓存组件;
七、slot插槽;

        插槽类似于插线板;
        类似就是提供一个页面;你可以插入一些东西;
        如果你插入就会有插入的东西如果没插入就没有插入的东西;
        插槽分类:
        1、匿名插槽;

            插槽没得名字的;

            

 

          组件里;
          

 

         使用组件里;

         


        2、具名插槽;

            插槽有名字的;

             

 

            

 

           具名插槽的使用情况:
           在封装的组件或者插件中;例如element UI 中的组件;
           

 

 


         3、作用域插槽;

             用于传递值的插槽;

            

 

 

            组件传值;

            

 

            进行解构了下;否则是对应对象的形式;

           

 

 


八、provide/inject;

      provide/inject ===> 依赖注入;
      可以直接父传孙组件;但是其是向下传递的;

         


九、如何封装组件

        

 

         

 

        

 

        对应切换的数据;
        

 

        子添加点击事件;传递对应的index;

         

 

         

 

         

 

     插槽;
     

 

   对应的这里;外部是本体内部是插槽;

   

 

进行插槽连接;