Skip to content

Commit

Permalink
fix: fix(cascader): 修复变更选项触发两次onchange事件和v-model绑定ref()没有响应式问题
Browse files Browse the repository at this point in the history
fix(cascader): 修复变更选项触发两次onchange事件和v-model绑定ref()没有响应式问题 Tencent#1086
  • Loading branch information
bitjian committed Sep 18, 2023
1 parent d7d6df4 commit fccc3c2
Show file tree
Hide file tree
Showing 2 changed files with 13 additions and 5 deletions.
3 changes: 1 addition & 2 deletions src/cascader/cascader.vue
Original file line number Diff line number Diff line change
Expand Up @@ -218,8 +218,7 @@ export default defineComponent({
childrenInfo.value = e;
childrenInfo.level = level;
} else {
setCascaderValue(item[(keys as Ref<KeysType>).value?.value ?? 'value']);
props.onChange?.(
setCascaderValue(
item[(keys as Ref<KeysType>).value?.value ?? 'value'],
items.map((item, index) => toRaw(item?.[selectedIndexes[index]])),
);
Expand Down
15 changes: 12 additions & 3 deletions src/shared/useVModel/index.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { ref, Ref, getCurrentInstance, ComponentInternalInstance } from 'vue';
import kebabCase from 'lodash/kebabCase';

export type ChangeHandler<T> = (value: T, ...args: any[]) => void;

Expand All @@ -10,12 +11,20 @@ export function useVModel<T>(
propName = 'value',
// emit 和 eventName 用于支持 v-model 和 xxx.sync 语法糖
): [Ref<T>, ChangeHandler<T>] {
const { emit } = getCurrentInstance() as ComponentInternalInstance;
const { emit, vnode } = getCurrentInstance() as ComponentInternalInstance;
const internalValue = ref<T>() as Ref<T>;
internalValue.value = defaultValue;

const vProps = vnode.props || {};
const isVM =
Object.prototype.hasOwnProperty.call(vProps, 'modelValue') ||
Object.prototype.hasOwnProperty.call(vProps, 'model-value');
const isVMP =
Object.prototype.hasOwnProperty.call(vProps, propName) ||
Object.prototype.hasOwnProperty.call(vProps, kebabCase(propName));

// 受控模式 v-model:propName
if (typeof value.value !== 'undefined') {
if (isVMP) {
return [
value,
(newValue, ...args) => {
Expand All @@ -26,7 +35,7 @@ export function useVModel<T>(
}

// 受控模式:modelValue v-model
if (typeof modelValue.value !== 'undefined') {
if (isVM) {
return [
modelValue,
(newValue, ...args) => {
Expand Down

0 comments on commit fccc3c2

Please sign in to comment.