成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

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

Cristic / 1105人閱讀

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

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

一、父子組件之間的通信

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

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

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

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

四、vue的路由部分

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

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

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

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

相關(guān)文章

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

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

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

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

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

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

    aboutU 評論0 收藏0
  • 初學(xué)vue.js記錄

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

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

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

    big_cat 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<