?

路由文件

{path: '/productListBase', name: 'productListLink', component: ProductListBase, redirect: '/productList', children: [{path: '/productList',components: {default: Banner,product_list: ProductList}}] },

?

這個是中間文件（也就是父級）

<template><div class="product"><router-view :aaa="aaa"></router-view><router-view name="product_list"></router-view></div> </template><script> export default {data(){return {aaa:{name_en:'PRODUCT',name_zh:'MIRROR產品'}}} } </script>

在父級設置參數，如果是aaa='aaa',此時傳的是aaa的字符串，而:aaa="aaa"傳的是對象（或數組）

?

在子頁面接收參數

export default {props:['aaa'],computed:{my(){this.banner = this.aaaconsole.log(this.aaa,'aaa')}}, }

通過?props 來接收父級傳過來的參數，然后在 使用computed屬性將收到的值賦給當前組件的data中的banner。

?

最后要記得在子頁面中調用 my() 方法

<template><div>{{my}}</div> </template>

?

?

子組件向父組件傳值

子組件

this.$emit("changes",1111);

父組件?

<searchH ref="searchH" @changes="aaa()"></searchH>methods:{aaa(e){console.log(e) } }

?

轉載于:https://www.cnblogs.com/cap-rq/p/10317352.html

總結

以上是生活随笔為你收集整理的每天一点点之vue框架开发 - vue组件之间传值（父向子传值）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。