vue组件通讯的传递方式（一）
父传子：
父组件App.vue中定义一个自定义属性title，然后在子组件中用props进行接收，最后用{{ title }}渲染页面
父组件App.vue代码：
<template>
<div id="app">
<big :title="msg"></big>
<smal></smal>
</div>
</template>
<script>
import Big from './components/Big'
import Smal from './components/Small'
export default {
name: 'App',
data() {
return {
msg:'吴刚'
}
},
components:{
Big,
Smal
},
}
</script>
<style>
#app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
}
</style>
子组件Big.vue代码:
<template>
<div>
big{{ title }}
<button>传值</button>
</div>
</template>
<script>
export default {
data() {
return {
msg:'吴与卿'
};
},
props:{
title:{
type:String, //检测类型
default :"岳秀清" //默认值
}
},
created() {
},
mounted() {
},
};
</script>
<style scoped>
</style>
