成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

vue組件學習-數(shù)據(jù)傳遞-路由(初學者文檔二)

Cristic / 1064人閱讀

摘要:接上次的驗證開始,組件中的作用域都是獨立的,子組件的模板不能直接引用父組件的數(shù)據(jù),要用特殊方法才能實現(xiàn)數(shù)據(jù)的傳遞。,環(huán)境的安裝第一步新建一個文件夾并初始化第二步安裝一級路由這個比較簡單,大多應用于單頁面應用,不必引入整個路由庫。

接上次的props驗證開始,組件中的作用域都是獨立的,子組件的模板不能直接引用父組件的數(shù)據(jù),要用特殊方法才能實現(xiàn)數(shù)據(jù)的傳遞。

一、父子組件之間的通信

    實例,點擊子組件的內(nèi)容,子組件自增一的同時,父組件的內(nèi)容也同時增加一。
        HTML代碼:
          
{{ total }}
JS部分內(nèi)容:

三、使用插槽分發(fā)內(nèi)容

    我們使用組件是為了更加的方便我們的工作,但是組件化也有不太方便的地方,就是數(shù)據(jù)的處理,
為了方便使用組件,可以引入slot元素作為數(shù)據(jù)插槽來進行數(shù)據(jù)的處理分發(fā)。當我們使用這個元素,
模板的內(nèi)容不會被替換掉,保留在我們想要插入的地方。

    示例代碼:
    HTML部分:
        
頭部內(nèi)容
2222
底部內(nèi)容
JS部分:

四、vue的路由部分

在這個部分,基本都推薦使用官方路由,更有官方文檔可以查看更加詳細內(nèi)容,這里我就簡單做一下示例。
  ①,環(huán)境的安裝
    第一步:新建一個文件夾并初始化
    npm init -y
    第二步:安裝
    npm i -S vue vue-router
    npm i -S axios
  
    4.1一級路由:這個比較簡單,大多應用于單頁面應用,不必引入整個路由庫。
      
新聞管理 商城管理
4.2 動態(tài)路由:當ID不同的用戶使用的時候,就需要這個組件來渲染 示例:
/user/foo /user/foo
4.3、監(jiān)聽路由變化 示例:
/user/foo /user/bar

關(guān)于路由,還有很多值得我們?nèi)W習的地方,推薦一個好用的網(wǎng)站
https://router.vuejs.org/zh-c...
這里有最詳細的學習路由的知識點

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/89809.html

相關(guān)文章

  • Vue學習日記(三)——Vue路由管理vue-router

    摘要:重定向可以實現(xiàn)某些需要根據(jù)特定邏輯改變頁面原本路由的需求,例如簡單的未登錄狀態(tài)下的頁面訪問個人信息路由時應該重定向到登錄路由頁面。 前言 為了給讀者更好的體驗,去理解vue-router和下一篇介紹vuex,決定還是來一個實戰(zhàn)教程來帶大家更加的去深入理解vue-router,在這之前,讀者先自行了解和去官網(wǎng)下載npm和node,附:npm官網(wǎng) 項目構(gòu)建 這里我采用vue-cli+web...

    iKcamp 評論0 收藏0
  • Vue學習日記(三)——Vue路由管理vue-router

    摘要:重定向可以實現(xiàn)某些需要根據(jù)特定邏輯改變頁面原本路由的需求,例如簡單的未登錄狀態(tài)下的頁面訪問個人信息路由時應該重定向到登錄路由頁面。 前言 為了給讀者更好的體驗,去理解vue-router和下一篇介紹vuex,決定還是來一個實戰(zhàn)教程來帶大家更加的去深入理解vue-router,在這之前,讀者先自行了解和去官網(wǎng)下載npm和node,附:npm官網(wǎng) 項目構(gòu)建 這里我采用vue-cli+web...

    tuniutech 評論0 收藏0
  • Vue學習日記(三)——Vue路由管理vue-router

    摘要:重定向可以實現(xiàn)某些需要根據(jù)特定邏輯改變頁面原本路由的需求,例如簡單的未登錄狀態(tài)下的頁面訪問個人信息路由時應該重定向到登錄路由頁面。 前言 為了給讀者更好的體驗,去理解vue-router和下一篇介紹vuex,決定還是來一個實戰(zhàn)教程來帶大家更加的去深入理解vue-router,在這之前,讀者先自行了解和去官網(wǎng)下載npm和node,附:npm官網(wǎng) 項目構(gòu)建 這里我采用vue-cli+web...

    aboutU 評論0 收藏0
  • 初學vue.js記錄

    摘要:初學應該學習哪些知識主要學習基礎知識。接下來要學習如何寫函數(shù),計算屬性。事件處理與修飾符事件通過指令來綁定,在中事件為事件名,所以是很好記憶的。這時可通過來獲取父組件傳遞的值并寫入模板,父組件可通過在子組件寫入屬性的方式傳遞數(shù)據(jù)。 前言 本人剛開始學習vue.js幾天,做了一些練習之后,鑒于每隔一段時間就把學習過的內(nèi)容總結(jié)一番,故此寫下此文章。初學Vue.js應該學習哪些知識 1、 v...

    enda 評論0 收藏0
  • VUE使用中踩過的坑

    摘要:前言如今可謂是一匹黑馬數(shù)已居第一位前端開發(fā)對于的使用已經(jīng)越來越多,它的優(yōu)點就不做介紹了本篇是我對使用過程中以及對一些社區(qū)朋友提問我的問題中做的一些總結(jié)幫助大家踩坑。隨后的重新渲染,元素組件及其所有的子節(jié)點將被視為靜態(tài)內(nèi)容并跳過。 前言 vue如今可謂是一匹黑馬,github star數(shù)已居第一位!前端開發(fā)對于vue的使用已經(jīng)越來越多,它的優(yōu)點就不做介紹了,本篇是我對vue使用過程中以及...

    big_cat 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<