初学vue3+ts：props的用法与注意事项

const props = defineProps({
	//对象
	config : {
		type :  Object as PropType<Config>,
		default : () => {
			return {};
		}
	},
	//某些固定值
	areaType : {
		type : String as PropType<'depart' | 'arrive'>,
		default : 'depart'
	},
	//数组
	option : {
		type : Array as PropType<ApiOrderTypes.GetNearByOpsItem[]>,
		default : () => []
	},
	//字符串
	activeMenuId : {
		type : String as PropType<MenuId>,
		default : ''
	}
});

或者跟vue2一样的写法

defineProps({
	color : {//文字颜色
		type : String,
		default : '#000'
	},
	isCustomHeader : {
		type : Boolean,
		default : false
	}
})

注意一点，如果使用eslint有警告props is assigned a value but never used，那就是在ts里，如果你const props = defineProps的话，但是在ts层又没用到这个key，只在视图层用到，那么可以把const props去掉，直接defineProps就行

const props = defineProps({
	list : {
		type : Array as PropType<ApiOrderTypes.GetNearByOrdersReq>,
		default : () => {
			return {};
		}
	}
});
//改成
defineProps({
	list : {
		...
	}
});

在js中用props获取里面的值

console.log(props.list);