uni-app组件

创建时间:2025-04-16 07:15
长度:667
浏览:0
评论:0

全局组件

   在uni-app项目中,我们只要在根目录创建一个components目录,里面的组件我们都是可以直接使用的,不需要安装、引入、注册等这么繁琐了

   在官方文档中也有介绍各种规则:  https://zh.uniapp.dcloud.io/component/#easycom


   定义组件使用defineProps

// 路径: /components/com-header/com-header.vue
<template>
	<view>
		hello {{username}}, age = {{age}}
	</view>
</template>

<script setup>
	defineProps(['username', 'age']);
</script>

<style>

</style>


// 调用
<com-header username="张三" :age="18"></com-header>


   defineProps约定参数

<script setup>
	defineProps({
		username: {
			default: '匿名',
			type: String
		},
		age: Number,
		demoAttr: {
			type: String,
			required: true,
		}
	});
</script>

   更多说明在vue文档有写着:  https://cn.vuejs.org/guide/components/props.html#prop-validation








评论(共0条)