父组件Home.vue
1 <template> 2 <div> 3 <h2>这是一个首页{{msg2}}</h2><button>按钮</button> 4 <v-header :title="title"></v-header><!--子组件并接收传值--> 5 </div> 6 </template> 7 8 <script> 9 import Header from './Header.vue';//引入子组件 10 11 export default { 12 data() { 13 return { 14 msg2: "我是一个方法", 15 title:'我是父组件home里面的data-title' //要传的值 16 } 17 }, 18 components:{ 19 'v-header':Header//注册子组件 20 } 21 } 22 </script>
子组件Header.vue
<template> <div> <h2>我是header---{{title}}</h2></div> <!--title的值来自于父组件--> </template> <script> export default { data(){ msg:'msgg' }, methods:{ }, props:['title']//接受父组件传过来的值 } </script> <style> </style>