vue 元件之間函式傳遞 元件之間相互傳遞引數

2021-10-17 05:13:48 字數 864 閱讀 7712

### rt:a,b兩個頁面傳遞引數

常用方法:`@click`的方式呼叫`$touter.push()`或者``的方式。

`push`方法:接收三個引數`name`,`params`,`query`;

* `$route.name`:路由配置中的`name`名稱,vue中具有`全域性全匹配片段`,意思就是這個`name`的名稱是全域性尋找到的,`動態片段`正則中的隨機,正則語法都是可以的。

* `$route.path`:對應當前路由的路徑,總是解析為絕對路徑,如 `/foo/bar`

* `$route.params`:`name`和`params`總是一起出現的,而`path`和`query`總是在一起的。

* 其他的看url,[看業務場景](

### 跳轉路由

1. `@click`事件,

this.$router.push( })

或者this.$router.push(})

params中的path可填可不填

2. query:會在url位址中顯示?operation=123;`params`url中顯示model/123

3. 使用`query`不需要設定路由,使用`params`需要設定路由

//配置的字尾引數

path: '/model/:operation',

//配置的引數可以選填,引數後面加乙個?就可以了

path: '/model/:operation?',

//路由配置名稱

name: 'model',

//引用的名稱

component: model

接收:this.$route.params.placeid

placeid 就是傳過去的傳引數

vue 元件之間傳遞資料

有pagea,pageb 元件 父元件 這兩元件將使用 header元件 子元件 header 中的 顯示的資料來自 pagea 與 pageb中。目錄結構 components pagea.vue pageb.vue sub header.vue header.vue 假設 要值的變數名為 nam...

vue元件之間通訊

個人blog,歡迎關注加收藏 元件之間通訊的幾種方式 1.父向子傳資料 props 2.子向父傳資料 emit 3.兄弟元件傳資料 a.事件匯流排 bus 在父元件的data中bus new vue 建立 事件匯流排 b.傳遞資料 this.roo t.bu s.root.bus.root.b us...

Vue元件之間通訊

vue元件傳值有以下幾種情況 父元件向子元件傳值 子元件向父元件傳值 兄弟元件之間傳值等 一 父元件向子元件傳值 傳值方式 props 動態傳遞值 子元件son 靜態傳值 父元件 子元件 son 1 prop的大小寫 html中的attribute名對大小寫不敏感,所以prop中的駝峰值需要等價於短...