自定義組件v-model報錯
"不能將類型“{ modelValue: { week: string; number: number; startTime: string; endTime: string; }[]; }”分配給類型“IntrinsicAttributes & (Partial<{ [x: number]: string; } | {}> & Omit<(readonly string[] | Readonly<ExtractPropTypes<Readonly<ComponentObjectPropsOptions<Data>>>>) & (VNodeProps & ... 2 more ... & Readonly<...>), never>)”草丧。\n 不能將類型“{ modelValue: { week: string; number: number; startTime: string; endTime: string; }[]; }”分配給類型“IntrinsicAttributes & Partial<{}> & Omit<(readonly string[] | Readonly<ExtractPropTypes<Readonly<ComponentObjectPropsOptions<Data>>>>) & (VNodeProps & ... 2 more ... & Readonly<...>), never>”儡陨。",
解決方案:使用v-model:xx格式
// 父
NumberList(v-model:list="numberList" @change="handleChangeNumber")
// 子
props: {
list: {
type: Array as PropType<NumberType[]>,
default: () => {
return [];
}
}
},
setup(props, { attrs, emit }) {
const numberList: any = computed({
get() {
return props.list;
},
set(val) {
emit("update:list", val);
}
});
})
ts聲明props類型
import { computed, ref, defineComponent, PropType } from "vue";
props: {
list: {
type: Array as PropType<NumberType[]>,
default: () => {
return [];
}
}
}
使用pug模板
安裝pug編譯模板矢赁,但是開發(fā)過程中prettier格式化對pug并不生效,經(jīng)過多次嘗試,確定可用的方法為vetur手動格式化(我的編輯器默認格式化工具是prettier),編輯器vetur配置為"vetur.format.defaultFormatter.pug": "prettier",
image.png
image.png