父组件向子组件传值
<template>
<div>
<h1>props、$emit</h1>
<app-child :name="name" :age="age" @start2="say2"></app-parent>
</div>
</template>
<script>
import AppChild from './child.vue';
export default {
data() {
return {
name: '传给子组件的值',
age: '18'
};
},
components: {
AppChild
},
methods: {
say2(val) {
alert(val)
console.log('第二个。。。。。');
}
}
}
</script>
子组件向父组件传值
<template>
<div>
<h3>子组件</h3>
<div>父组件传递过来的名称: {{name}}</div>
<div @click='dianji('测试')'>父组件传递过来的年龄: {{age}}</div>
</div>
</template>
<script>
export default {
data() {
return {
};
},
props: ['name', 'age'],
components: {},
created() {
},
mounted() {
dianji(val){
this.$emit('start2',val);
}
},
}
</script>