vue組件定義、組件的切換、組件的通信、渲染組件的幾種方式(標簽、路由、render)


vue中全局的概念是什么?---就是全局定義的功能,所有實例化的vm都可以使用,  全局定義的是掛在構造函數Vue上面的,所以實例化出的對象都可以使用這個功能

1、什么是組件?---從UI的角度把頁面拆分成不同的部分,組件的優勢:可復用,能夠拆分vue實例代碼,保證代碼的可讀性

 

  模塊化和前端組件化的區別:一個是從功能上拆分一個是從ui角度去拆分

2、定義vue組件

  全局組件定義的3種方式

  

    

  私有組件的定義

    使用的是components來定義私有組件

     

 3、組件中的data

    

    

4、組件的切換

   

    上面的v-if  和 v-else 切換有缺陷:只能切換2個,要是3個或以上,就切換不了了

    改造:如下

    

    

    組件切換的動畫

    

 5、組件之前的傳值問題

    

    

    正確用法:

    

    

    注意:props數組里的值都是從父組件里傳遞過來的,只能是小寫,只讀不可改

      

    父組件向子組件傳遞事件---注意傳遞的是方法不是方法的結果,所以不要小括號

    

6、復習

  

 

 7、本地存儲案例----評論列表的存和取

  

  

 

 8、$refs的使用---this.$refs.xxx   獲取dom節點(獲取的是dom對象,原生js對象)

  

     

 9、用render函數渲染組件

  

 

   

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

   

 

 

  

  

 

  

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM