1、父组件给子组件传值方法，使用props

父页面：parent.vue

<template>
	<div>
		<children :transmit="account"></children>
	</div>
</template>
<script>
	import children from './children.vue'
	export default {
		data() {
			return {
				account: 'admin',
			}
		},
		components: {
			children
		}
	}
</script>

子页面：child.vue

<template>
	<div>
		{{transmit}}
	</div>
</template>
<script>
	export default {
		name: 'children',
		props: ['transmit'],
        // props: {
			transmit: {
				type: String,
				default: null
			}
		},
	}
</script>

?步骤说明

用import引入子组件
在components中注入子组件
在子组件中定义一个指令：transmit="account"? 。transmit名称需要和子组件中的props保持一致，transmit是要传递给子组件的数据。
在子组件中定义props属性，transmit的type可以自定义类型（但是必须和父组件中的数据类型一致，否则会报错），default是默认值。

2、子组件要给父组件传值方法，使用$emit

父页面：parent.vue

<template>
	<div>
		<children @childFn="parentFn"></children>
	</div>
</template>
<script>
	import children from './children.vue'
	export default {
		data() {
			return {
				message: '',
			}
		},
		components: {
			children
		},
		methods: {
			parentFn(childData) {
				console.log(childData)
				this.message = childData;
			}
		}
	}
</script>

子页面：child.vue

<template>
	<div>
		<input type="text" v-model="message" />
		<button @click="sendClick">发送给父组件</button>
	</div>
</template>
<script>
	export default {
		name: 'children',
		data() {
			return {
				message: '',
			}
		},
		methods: {
			// 发送
			sendClick() {
				this.$emit('childFn', this.message);
			}
		}
	}
</script>

步骤说明