项目场景:
在vue3
版本3.4
以下,无法使用defineModel()
直接双向绑定。而要使用如下方式:
一个名为 modelValue 的 prop,本地 ref 的值与其同步;
一个名为 update:modelValue 的事件,当本地 ref 的值发生变更时触发
问题描述
如果按下面代码编写
父组件代码如下:
<companySelect :company="formModel.filterType" />
子组件代码:
<template><a-select:v-model="company":options="options"placeholder="请输入":filter-option="false":field-names="fieldNames":loading="companyLoading":show-extra-options="false":allow-clear="true"allow-search@search="handleSearch"@change="$emit('update:company', $event)"/>
</template>
结果发现子组件emit无法update父组件的值
原因分析:
不太清楚。但有解决方案。
解决方案:
仅需要将父组件v-model写全就可以了。
<companySelect v-model:company="formModel.filterType" />