🐛(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…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user