interface FormState {
name: string;
state: string | undefined;
startDate: Moment | undefined;
endDate: Moment | undefined;
priority?: number;
remark: string;
}
export default defineComponent({
setup() {
const formState: UnwrapRef<FormState> = reactive({
name: '',
state: undefined,
startDate: undefined,
endDate: undefined,
remark: '',
});
const onSubmit = () => {
console.log('submit!', toRaw(formState));
};
return {
labelCol: { span: 4 },
wrapperCol: { span: 14 },
formState,
onSubmit,
};
},
});
？的作用
四、属性数量不确定时的定义方法
如果使用接口来限定了变量或者形参, 那么在给变量或者形参赋值的时候, 赋予的值就必须和接口限定的一模一样才可以, 多一个或者少一个都不行。
但是开发中我们往往可能会遇到少一个或者多一个的场景。
（1）少一个，用可选属性
可选属性意如其名，用法也简单，只需要在属性名字后面加一个？即可。
// 需求: 如果传递了middleName就输出完整名称, 如果没有传递middleName, 那么就输出firstName和lastName
interface FullName{
firstName:string
lastName:string
middleName?:string
[propName:string]:any
}
function say({firstName, lastName, middleName}:FullName):void {
// console.log(我的姓名是:${firstName}_${lastName});
if(middleName){
console.log(我的姓名是:${firstName}_${middleName}_${lastName});
}else{
console.log(我的姓名是:${firstName}_${lastName});
}
}
say({firstName:'Jonathan', lastName:'Lee', middleName:"666"});
say({firstName:'Jonathan', lastName:'Lee'});
关于问号语法的原文链接：https://blog.csdn.net/weixin_39663933/article/details/111346766
参考文章：https://blog.csdn.net/weixin_46025371/article/details/116694992
