uniapp中组件的引用、组件之间数据的传递

一、组件的引用

1.首先有一个写好的组件cli-header.vue  目录为 /pages/client/client-components/cli-header.vue

2.在需要调用的页面编写代码

<template>
    <cliHeader />
</template>

<script>
    import cliHeader from '@/pages/client/client-components/cli-header.vue'
</script>

<style>
    export default {
        components: {
            cliHeader
        }
    }
</style>

注意cliHeader的名称需要三处对应

 

二、组件之间数据的传递

父组件代码格式 <cliHeader :isEditing="isEditing" />  可以将isEditing传递给cliHeader 组件

子组件接收格式

<script>
	export default {
		props: {
			isEditing: {
				type: Boolean,
				default: false, // 默认值为 false
			},
		},
    }
</script>