[新增] dropdown组件添加disabled属性
This commit is contained in:
parent
305eff05e5
commit
b914103920
@ -80,6 +80,37 @@ export default {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
::: title 禁用弹出
|
||||||
|
:::
|
||||||
|
|
||||||
|
::: demo
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<lay-dropdown>
|
||||||
|
<lay-button type="primary" disabled>点击无效</lay-button>
|
||||||
|
<template #content>
|
||||||
|
<lay-dropdown-menu>
|
||||||
|
<lay-dropdown-menu-item>选项一</lay-dropdown-menu-item>
|
||||||
|
<lay-dropdown-menu-item>选项二</lay-dropdown-menu-item>
|
||||||
|
<lay-dropdown-menu-item>选项三</lay-dropdown-menu-item>
|
||||||
|
</lay-dropdown-menu>
|
||||||
|
</template>
|
||||||
|
</lay-dropdown>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { ref } from 'vue'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
setup() {
|
||||||
|
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
::: title Dropdown 属性
|
::: title Dropdown 属性
|
||||||
@ -90,6 +121,7 @@ export default {
|
|||||||
| 属性 | 描述 | 可选值 |
|
| 属性 | 描述 | 可选值 |
|
||||||
| ------- | -------- | --------------- |
|
| ------- | -------- | --------------- |
|
||||||
| trigger | 触发方式 | `click` `hover` |
|
| trigger | 触发方式 | `click` `hover` |
|
||||||
|
| disabled | 是否禁用触发 | `true` `false` |
|
||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
|
@ -12,10 +12,12 @@ import { DropdownTrigger } from "./interface";
|
|||||||
|
|
||||||
export interface LayDropdownProps {
|
export interface LayDropdownProps {
|
||||||
trigger?: DropdownTrigger;
|
trigger?: DropdownTrigger;
|
||||||
|
disabled?: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<LayDropdownProps>(), {
|
const props = withDefaults(defineProps<LayDropdownProps>(), {
|
||||||
trigger: "click",
|
trigger: "click",
|
||||||
|
disabled: false
|
||||||
});
|
});
|
||||||
|
|
||||||
const openState = ref(false);
|
const openState = ref(false);
|
||||||
@ -26,7 +28,8 @@ onClickOutside(dropdownRef, (event) => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
const open = function () {
|
const open = function () {
|
||||||
openState.value = true;
|
if (props.disabled === false)
|
||||||
|
openState.value = true;
|
||||||
};
|
};
|
||||||
|
|
||||||
const hide = function () {
|
const hide = function () {
|
||||||
@ -34,7 +37,8 @@ const hide = function () {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const toggle = function () {
|
const toggle = function () {
|
||||||
openState.value = !openState.value;
|
if (props.disabled === false)
|
||||||
|
openState.value = !openState.value;
|
||||||
};
|
};
|
||||||
|
|
||||||
provide("openState", openState);
|
provide("openState", openState);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user