🐛(select): 修复多选模式下 disabled 属性失效
This commit is contained in:
parent
5646ae298e
commit
326dc13ec3
@ -1,7 +1,10 @@
|
||||
<template>
|
||||
<div
|
||||
:size="size"
|
||||
:class="['layui-cascader', { 'layui-cascader-opend': openState, 'layui-disabled': disabled }]"
|
||||
:class="[
|
||||
'layui-cascader',
|
||||
{ 'layui-cascader-opend': openState, 'layui-disabled': disabled },
|
||||
]"
|
||||
>
|
||||
<lay-dropdown
|
||||
ref="dropdownRef"
|
||||
|
@ -411,7 +411,10 @@ function hex2rgba(s: any) {
|
||||
:contentStyle="contentStyle"
|
||||
updateAtScroll
|
||||
>
|
||||
<div class="layui-unselect layui-colorpicker" :class="[{'layui-disabled': disabled}]">
|
||||
<div
|
||||
class="layui-unselect layui-colorpicker"
|
||||
:class="[{ 'layui-disabled': disabled }]"
|
||||
>
|
||||
<span>
|
||||
<span
|
||||
class="layui-colorpicker-trigger-span"
|
||||
|
@ -146,7 +146,8 @@ const searchList = (str: string, container: any) => {
|
||||
updateAtScroll
|
||||
>
|
||||
<div
|
||||
class="layui-inline layui-border-box layui-iconpicker layui-iconpicker-split" :class="[{'layui-disabled': disabled}]"
|
||||
class="layui-inline layui-border-box layui-iconpicker layui-iconpicker-split"
|
||||
:class="[{ 'layui-disabled': disabled }]"
|
||||
>
|
||||
<div class="layui-inline layui-iconpicker-main">
|
||||
<i class="layui-inline layui-icon" :class="[selectedIcon]"></i>
|
||||
|
@ -121,7 +121,10 @@ const onCompositionend = (event: Event) => {
|
||||
};
|
||||
|
||||
const classes = computed(() => {
|
||||
return { "layui-input-disabled": props.disabled, 'layui-input-has-prefix': slots.prefix || props.prefixIcon };
|
||||
return {
|
||||
"layui-input-disabled": props.disabled,
|
||||
"layui-input-has-prefix": slots.prefix || props.prefixIcon,
|
||||
};
|
||||
});
|
||||
|
||||
const showPassword = () => {
|
||||
@ -134,11 +137,7 @@ const showPassword = () => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="layui-input"
|
||||
:class="classes"
|
||||
:size="size"
|
||||
>
|
||||
<div class="layui-input" :class="classes" :size="size">
|
||||
<div class="layui-input-prepend" v-if="slots.prepend">
|
||||
<slot name="prepend"></slot>
|
||||
</div>
|
||||
|
@ -190,6 +190,7 @@ provide("multiple", multiple);
|
||||
:collapseTagsTooltip="collapseTagsTooltip"
|
||||
:minCollapsedNum="minCollapsedNum"
|
||||
:disabledInput="true"
|
||||
:disabled="disabled"
|
||||
:size="size"
|
||||
:class="{ 'layui-unselect': true }"
|
||||
@clear="handleClear"
|
||||
|
@ -181,7 +181,7 @@ const components: Record<string, Plugin> = {
|
||||
LaySpace,
|
||||
LayTag,
|
||||
LayTagInput,
|
||||
LayTreeSelect
|
||||
LayTreeSelect,
|
||||
};
|
||||
|
||||
const install = (app: App, options?: InstallOptions): void => {
|
||||
|
@ -71,6 +71,45 @@ export default {
|
||||
|
||||
:::
|
||||
|
||||
|
||||
::: title 禁止选择
|
||||
:::
|
||||
|
||||
::: demo 通过 show-search 属性开启内容检索, input 变为可输入状态。在 multiple 模式下, 检索框位于 dropdown 顶部。
|
||||
|
||||
<template>
|
||||
<lay-space>
|
||||
<lay-select v-model="value3" :disabled="true">
|
||||
<lay-select-option value="1" label="学习"></lay-select-option>
|
||||
<lay-select-option value="2" label="编码"></lay-select-option>
|
||||
<lay-select-option value="3" label="运动"></lay-select-option>
|
||||
</lay-select>
|
||||
<lay-select v-model="value4" :disabled="true" :multiple="true">
|
||||
<lay-select-option value="1" label="学习"></lay-select-option>
|
||||
<lay-select-option value="2" label="编码"></lay-select-option>
|
||||
<lay-select-option value="3" label="运动"></lay-select-option>
|
||||
</lay-select>
|
||||
</lay-space>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref } from 'vue'
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
|
||||
const value3 = ref('1')
|
||||
const value4 = ref(['1'])
|
||||
return {
|
||||
value3,
|
||||
value4
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
:::
|
||||
|
||||
::: title 开启检索
|
||||
:::
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user