使用这个Vnode的原因是因为业务中需要一个弹框回调一下接口,但是弹框里只需要一个选择框,如果用弹框的话,觉得代码多,里面就放一项不值得。其实就是懒的写那么多东西!!直接上代码
ElMessageBox({
title: "补报",
message: () =>
h(ElDatePicker, {
modelValue: repayVal.value,
type: "dates",
placeholder: "请选择补报时间",
dateFormat: "YYYY-MM-DD",
valueFormat: "YYYY-MM-DD",
style: "width: 100%",
"onUpdate:modelValue": (val: string) => {
repayVal.value = val;
}
}),
showCancelButton: true,
showConfirmButton: true,
beforeClose: async (_, _1, done) => {
if (repayVal.value) {
const { ok } = await fetchRebooking({ reportDay: repayVal.value });
if (ok) {
ElMessage.success("补报成功");
}
}
done();
}
});
看element-plus官网的示例感觉有点麻烦,在想能不能直接双向绑定使用的数据,比如如果vnode是个input怎么绑定 也去查看了vue官网中 h() 创建虚拟 DOM 节点 (vnode)的用法也找到(应该是自己比较菜,没看过源码不了解h函数的具体用法)。公共GTP(现在已经离不开了,比百度强太多了)查阅到
重点就是onUpdate:modelValue这个方法
在此记录一下~~~