🌀(component): 优化inputNumber与button在禁用状态下的样式
This commit is contained in:
		
							parent
							
								
									f1bd2611f9
								
							
						
					
					
						commit
						29afa1114f
					
				@ -1,6 +1,6 @@
 | 
			
		||||
{
 | 
			
		||||
  "name": "@layui/layui-vue",
 | 
			
		||||
  "version": "1.3.0-alpha.1",
 | 
			
		||||
  "version": "1.3.0-alpha.2",
 | 
			
		||||
  "author": "就眠儀式",
 | 
			
		||||
  "license": "MIT",
 | 
			
		||||
  "description": "a component library for Vue 3 base on layui-vue",
 | 
			
		||||
 | 
			
		||||
@ -31,6 +31,9 @@
 | 
			
		||||
  border-width: 1px;
 | 
			
		||||
  border-style: solid;
 | 
			
		||||
  cursor: pointer;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.layui-btn:not(.layui-btn-disabled){
 | 
			
		||||
  :hover,
 | 
			
		||||
  :active {
 | 
			
		||||
    color: #333;
 | 
			
		||||
 | 
			
		||||
@ -62,13 +62,23 @@ watch(
 | 
			
		||||
const tempValue = ref(0);
 | 
			
		||||
let timer: any = 0;
 | 
			
		||||
 | 
			
		||||
const minControl = computed(
 | 
			
		||||
  () => props.min !== -Infinity && Number(props.min) >= num.value
 | 
			
		||||
);
 | 
			
		||||
const minControl = computed(() => {
 | 
			
		||||
  if(props.disabled){
 | 
			
		||||
    return true;
 | 
			
		||||
  }
 | 
			
		||||
  if(props.min !== -Infinity){
 | 
			
		||||
    return Number(props.min) >= num.value;
 | 
			
		||||
  }
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
const maxControl = computed(
 | 
			
		||||
  () => props.max !== Infinity && Number(props.max) <= num.value
 | 
			
		||||
);
 | 
			
		||||
const maxControl = computed(() => {
 | 
			
		||||
  if(props.disabled){
 | 
			
		||||
    return true;
 | 
			
		||||
  }
 | 
			
		||||
  if(props.max !== Infinity ){
 | 
			
		||||
    return Number(props.max) <= num.value;
 | 
			
		||||
  }
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
const addition = function () {
 | 
			
		||||
  num.value += Number(props.step);
 | 
			
		||||
@ -127,6 +137,7 @@ const isNumber = function (num: any) {
 | 
			
		||||
        type="number"
 | 
			
		||||
        :name="name"
 | 
			
		||||
        @change="inputChange"
 | 
			
		||||
        :disabled="disabledInput||disabled"
 | 
			
		||||
      />
 | 
			
		||||
    </div>
 | 
			
		||||
    <lay-button
 | 
			
		||||
 | 
			
		||||
@ -23,6 +23,8 @@
 | 
			
		||||
          <li>[修复] datePicker 组件 上一次更新带来的Bug。 by @SmallWai</li> 
 | 
			
		||||
          <li>[优化] radio 组件 动画效果。 by @SmallWai</li> 
 | 
			
		||||
          <li>[新增] formItem 组件 label-width属性,用于控制宽度 by @SmallWai</li> 
 | 
			
		||||
          <li>[优化] inputNumber 组件 禁用状态下的样式 by @SmallWai</li>
 | 
			
		||||
          <li>[优化] botton 组件 禁用状态下的icon hover样式 by @SmallWai</li>
 | 
			
		||||
        </ul>
 | 
			
		||||
      </li>
 | 
			
		||||
    </ul>   
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user