Skip to content

U
uni-app

菜鸟程序猿_c / uni-app
与 Fork 源项目一致

Fork自 DCloud / uni-app

通知 1
Star 1
Fork 0
U
uni-app

体验新版 GitCode，发现更多精彩内容 >>

提交 6a45061c 编写于 作者: Q qiang
浏览文件
操作

fix: 废弃 input 组件 verifyNumber 参数

上级 c27d5a70
隐藏空白更改
内联 并排
Showing with 166 addition and 160 deletion
packages/uni-components/src/components/input/index.tsx
浏览文件 @ 6a45061c
......@@ -12,10 +12,6 @@ const props = /*#__PURE__*/ extend({}, fieldProps, {
type: String,
default: 'input-placeholder',
},
verifyNumber: {
type: Boolean,
default: false,
},
})
export default /*#__PURE__*/ defineBuiltInComponent({
......@@ -45,33 +41,45 @@ export default /*#__PURE__*/ defineBuiltInComponent({
}
return props.password ? 'password' : type
})
const valid = ref(true)
let cachedValue = ''
let cache = ref('')
let resetCache: (() => void) | null
const rootRef: Ref<HTMLElement | null> = ref(null)
const { fieldRef, state, scopedAttrsState, fixDisabledColor, trigger } =
useField(props, rootRef, emit, (event, state) => {
const input = event.target as HTMLInputElement
if (NUMBER_TYPES.includes(props.type)) {
// 在输入 - 负号 的情况下，event.target.value没有值，但是会触发校验 false
valid.value = input.validity && input.validity.valid
if (!props.verifyNumber) {
cachedValue = state.value
} else {
// 处理部分输入法可以输入其它字符的情况，此处理无法先输入 -(负号)，只能输入数字再移动光标输入负号
if (input.validity && !valid.value) {
input.value = cachedValue
state.value = input.value
// 输入非法字符不触发 input 事件
if (type.value === 'number') {
// 数字类型输入错误时无法获取具体的值，自定义校验和纠正。
if (resetCache) {
input.removeEventListener('blur', resetCache)
resetCache = null
}
if (input.validity && !input.validity.valid) {
if (
(!cache.value && (event as InputEvent).data === '-') ||
(cache.value[0] === '-' &&
(event as InputEvent).inputType === 'deleteContentBackward')
) {
cache.value = '-'
state.value = ''
resetCache = () => {
cache.value = input.value = ''
}
input.addEventListener('blur', resetCache)
return false
} else {
cachedValue = state.value
}
cache.value =
state.value =
input.value =
cache.value === '-' ? '' : cache.value
// 输入非法字符不触发 input 事件
return false
} else {
cache.value = input.value
}
}
// type="number" 不支持 maxlength 属性，因此需要主动限制长度。
if (type.value === 'number') {
// type="number" 不支持 maxlength 属性，因此需要主动限制长度。
const maxlength = state.maxlength
if (maxlength > 0 && input.value.length > maxlength) {
input.value = input.value.slice(0, maxlength)
......@@ -80,12 +88,6 @@ export default /*#__PURE__*/ defineBuiltInComponent({
return false
}
}
if (!props.verifyNumber) {
return {
valid: valid.value,
}
}
})
const NUMBER_TYPES = ['number', 'digit']
const step = computed(() =>
......@@ -137,7 +139,7 @@ export default /*#__PURE__*/ defineBuiltInComponent({
<uni-input ref={rootRef}>
<div class="uni-input-wrapper">
<div
v-show={!(state.value.length || !valid.value)}
v-show={!(state.value.length || cache.value === '-')}
{...scopedAttrsState.attrs}
style={props.placeholderStyle}
class={['uni-input-placeholder', props.placeholderClass]}
......
packages/uni-components/src/helpers/useField.ts
浏览文件 @ 6a45061c
......@@ -350,10 +350,9 @@ function useEvent(
}
const onInput = function (event: Event, force?: boolean) {
event.stopPropagation()
let beforeInputDetail: Object | Boolean | undefined = {}
if (
typeof beforeInput === 'function' &&
(beforeInputDetail = beforeInput(event, state)) === false
beforeInput(event, state) === false
) {
return
}
......@@ -361,16 +360,10 @@ function useEvent(
if (!state.composing) {
triggerInput(
event,
extend(
{
value: field.value,
cursor: field.selectionEnd,
},
(() =>
beforeInputDetail instanceof Object
? beforeInputDetail
: undefined)()
),
{
value: field.value,
cursor: field.selectionEnd,
},
force
)
}
......
packages/uni-h5/dist/uni-h5.cjs.js
浏览文件 @ 6a45061c
......@@ -3075,16 +3075,15 @@ function useEvent(fieldRef, state, trigger, triggerInput, beforeInput) {
};
const onInput = function(event, force) {
event.stopPropagation();
let beforeInputDetail = {};
if (typeof beforeInput === "function" && (beforeInputDetail = beforeInput(event, state)) === false) {
if (typeof beforeInput === "function" && beforeInput(event, state) === false) {
return;
}
state.value = field.value;
if (!state.composing) {
triggerInput(event, shared.extend({
triggerInput(event, {
value: field.value,
cursor: field.selectionEnd
}, (() => beforeInputDetail instanceof Object ? beforeInputDetail : void 0)()), force);
}, force);
}
};
const onBlur = function(event) {
......@@ -3140,10 +3139,6 @@ const props$n = /* @__PURE__ */ shared.extend({}, props$o, {
placeholderClass: {
type: String,
default: "input-placeholder"
},
verifyNumber: {
type: Boolean,
default: false
}
});
var Input = /* @__PURE__ */ defineBuiltInComponent({
......@@ -3174,8 +3169,8 @@ var Input = /* @__PURE__ */ defineBuiltInComponent({
}
return props2.password ? "password" : type2;
});
const valid = vue.ref(true);
let cachedValue = "";
let cache = vue.ref("");
let resetCache;
const rootRef = vue.ref(null);
const {
fieldRef,
......@@ -3185,21 +3180,26 @@ var Input = /* @__PURE__ */ defineBuiltInComponent({
trigger
} = useField(props2, rootRef, emit2, (event, state2) => {
const input = event.target;
if (NUMBER_TYPES.includes(props2.type)) {
valid.value = input.validity && input.validity.valid;
if (!props2.verifyNumber) {
cachedValue = state2.value;
} else {
if (input.validity && !valid.value) {
input.value = cachedValue;
state2.value = input.value;
if (type.value === "number") {
if (resetCache) {
input.removeEventListener("blur", resetCache);
resetCache = null;
}
if (input.validity && !input.validity.valid) {
if (!cache.value && event.data === "-" || cache.value[0] === "-" && event.inputType === "deleteContentBackward") {
cache.value = "-";
state2.value = "";
resetCache = () => {
cache.value = input.value = "";
};
input.addEventListener("blur", resetCache);
return false;
} else {
cachedValue = state2.value;
}
cache.value = state2.value = input.value = cache.value === "-" ? "" : cache.value;
return false;
} else {
cache.value = input.value;
}
}
if (type.value === "number") {
const maxlength = state2.maxlength;
if (maxlength > 0 && input.value.length > maxlength) {
input.value = input.value.slice(0, maxlength);
......@@ -3207,11 +3207,6 @@ var Input = /* @__PURE__ */ defineBuiltInComponent({
return false;
}
}
if (!props2.verifyNumber) {
return {
valid: valid.value
};
}
});
const NUMBER_TYPES = ["number", "digit"];
const step = vue.computed(() => NUMBER_TYPES.includes(props2.type) ? "0.000000000000000001" : "");
......@@ -3255,7 +3250,7 @@ var Input = /* @__PURE__ */ defineBuiltInComponent({
}, [vue.withDirectives(vue.createVNode("div", vue.mergeProps(scopedAttrsState.attrs, {
"style": props2.placeholderStyle,
"class": ["uni-input-placeholder", props2.placeholderClass]
}), [props2.placeholder], 16), [[vue.vShow, !(state.value.length || !valid.value)]]), props2.confirmType === "search" ? vue.createVNode("form", {
}), [props2.placeholder], 16), [[vue.vShow, !(state.value.length || cache.value === "-")]]), props2.confirmType === "search" ? vue.createVNode("form", {
"action": "",
"onSubmit": (event) => event.preventDefault(),
"class": "uni-input-form"
......@@ -5239,6 +5234,7 @@ var index$i = /* @__PURE__ */ defineBuiltInComponent({
}, [vue.createVNode("div", {
"class": "uni-scroll-view-refresh-inner"
}, [refreshState == "pulling" ? vue.createVNode("svg", {
"key": "refresh__icon",
"style": {
transform: "rotate(" + refreshRotate + "deg)"
},
......@@ -5253,6 +5249,7 @@ var index$i = /* @__PURE__ */ defineBuiltInComponent({
"d": "M0 0h24v24H0z",
"fill": "none"
}, null)], 4) : null, refreshState == "refreshing" ? vue.createVNode("svg", {
"key": "refresh__spinner",
"class": "uni-scroll-view-refresh__spinner",
"width": "24",
"height": "24",
......@@ -5295,11 +5292,11 @@ function useScrollViewLoader(props2, state, scrollTopNumber, scrollLeftNumber, t
let __transitionEnd = () => {
};
vue.computed(() => {
var val = Number(props2.upperThreshold);
let val = Number(props2.upperThreshold);
return isNaN(val) ? 50 : val;
});
vue.computed(() => {
var val = Number(props2.lowerThreshold);
let val = Number(props2.lowerThreshold);
return isNaN(val) ? 50 : val;
});
function scrollTo(scrollToValue, direction) {
......@@ -5359,14 +5356,14 @@ function useScrollViewLoader(props2, state, scrollTopNumber, scrollLeftNumber, t
console.error(`id error: scroll-into-view=${val}`);
return;
}
var element = rootRef.value.querySelector("#" + val);
let element = rootRef.value.querySelector("#" + val);
if (element) {
var mainRect = main.value.getBoundingClientRect();
var elRect = element.getBoundingClientRect();
let mainRect = main.value.getBoundingClientRect();
let elRect = element.getBoundingClientRect();
if (props2.scrollX) {
var left = elRect.left - mainRect.left;
var scrollLeft = main.value.scrollLeft;
var x = scrollLeft + left;
let left = elRect.left - mainRect.left;
let scrollLeft = main.value.scrollLeft;
let x = scrollLeft + left;
if (props2.scrollWithAnimation) {
scrollTo(x, "x");
} else {
......@@ -5374,9 +5371,9 @@ function useScrollViewLoader(props2, state, scrollTopNumber, scrollLeftNumber, t
}
}
if (props2.scrollY) {
var top = elRect.top - mainRect.top;
var scrollTop = main.value.scrollTop;
var y = scrollTop + top;
let top = elRect.top - mainRect.top;
let scrollTop = main.value.scrollTop;
let y = scrollTop + top;
if (props2.scrollWithAnimation) {
scrollTo(y, "y");
} else {
......
packages/uni-h5/dist/uni-h5.es.js
浏览文件 @ 6a45061c
......@@ -8095,16 +8095,15 @@ function useEvent(fieldRef, state2, trigger, triggerInput, beforeInput) {
};
const onInput = function(event, force) {
event.stopPropagation();
let beforeInputDetail = {};
if (typeof beforeInput === "function" && (beforeInputDetail = beforeInput(event, state2)) === false) {
if (typeof beforeInput === "function" && beforeInput(event, state2) === false) {
return;
}
state2.value = field.value;
if (!state2.composing) {
triggerInput(event, extend({
triggerInput(event, {
value: field.value,
cursor: field.selectionEnd
}, (() => beforeInputDetail instanceof Object ? beforeInputDetail : void 0)()), force);
}, force);
}
};
const onBlur = function(event) {
......@@ -8160,10 +8159,6 @@ const props$u = /* @__PURE__ */ extend({}, props$v, {
placeholderClass: {
type: String,
default: "input-placeholder"
},
verifyNumber: {
type: Boolean,
default: false
}
});
var Input = /* @__PURE__ */ defineBuiltInComponent({
......@@ -8194,8 +8189,8 @@ var Input = /* @__PURE__ */ defineBuiltInComponent({
}
return props2.password ? "password" : type2;
});
const valid = ref(true);
let cachedValue = "";
let cache = ref("");
let resetCache;
const rootRef = ref(null);
const {
fieldRef,
......@@ -8205,21 +8200,26 @@ var Input = /* @__PURE__ */ defineBuiltInComponent({
trigger
} = useField(props2, rootRef, emit2, (event, state3) => {
const input = event.target;
if (NUMBER_TYPES.includes(props2.type)) {
valid.value = input.validity && input.validity.valid;
if (!props2.verifyNumber) {
cachedValue = state3.value;
} else {
if (input.validity && !valid.value) {
input.value = cachedValue;
state3.value = input.value;
if (type.value === "number") {
if (resetCache) {
input.removeEventListener("blur", resetCache);
resetCache = null;
}
if (input.validity && !input.validity.valid) {
if (!cache.value && event.data === "-" || cache.value[0] === "-" && event.inputType === "deleteContentBackward") {
cache.value = "-";
state3.value = "";
resetCache = () => {
cache.value = input.value = "";
};
input.addEventListener("blur", resetCache);
return false;
} else {
cachedValue = state3.value;
}
cache.value = state3.value = input.value = cache.value === "-" ? "" : cache.value;
return false;
} else {
cache.value = input.value;
}
}
if (type.value === "number") {
const maxlength = state3.maxlength;
if (maxlength > 0 && input.value.length > maxlength) {
input.value = input.value.slice(0, maxlength);
......@@ -8227,11 +8227,6 @@ var Input = /* @__PURE__ */ defineBuiltInComponent({
return false;
}
}
if (!props2.verifyNumber) {
return {
valid: valid.value
};
}
});
const NUMBER_TYPES = ["number", "digit"];
const step = computed(() => NUMBER_TYPES.includes(props2.type) ? "0.000000000000000001" : "");
......@@ -8275,7 +8270,7 @@ var Input = /* @__PURE__ */ defineBuiltInComponent({
}, [withDirectives(createVNode("div", mergeProps(scopedAttrsState.attrs, {
"style": props2.placeholderStyle,
"class": ["uni-input-placeholder", props2.placeholderClass]
}), [props2.placeholder], 16), [[vShow, !(state2.value.length || !valid.value)]]), props2.confirmType === "search" ? createVNode("form", {
}), [props2.placeholder], 16), [[vShow, !(state2.value.length || cache.value === "-")]]), props2.confirmType === "search" ? createVNode("form", {
"action": "",
"onSubmit": (event) => event.preventDefault(),
"class": "uni-input-form"
......@@ -11365,6 +11360,7 @@ var ScrollView = /* @__PURE__ */ defineBuiltInComponent({
}, [createVNode("div", {
"class": "uni-scroll-view-refresh-inner"
}, [refreshState == "pulling" ? createVNode("svg", {
"key": "refresh__icon",
"style": {
transform: "rotate(" + refreshRotate + "deg)"
},
......@@ -11379,6 +11375,7 @@ var ScrollView = /* @__PURE__ */ defineBuiltInComponent({
"d": "M0 0h24v24H0z",
"fill": "none"
}, null)], 4) : null, refreshState == "refreshing" ? createVNode("svg", {
"key": "refresh__spinner",
"class": "uni-scroll-view-refresh__spinner",
"width": "24",
"height": "24",
......@@ -11422,11 +11419,11 @@ function useScrollViewLoader(props2, state2, scrollTopNumber, scrollLeftNumber,
let __transitionEnd = () => {
};
const upperThresholdNumber = computed(() => {
var val = Number(props2.upperThreshold);
let val = Number(props2.upperThreshold);
return isNaN(val) ? 50 : val;
});
const lowerThresholdNumber = computed(() => {
var val = Number(props2.lowerThreshold);
let val = Number(props2.lowerThreshold);
return isNaN(val) ? 50 : val;
});
function scrollTo2(scrollToValue, direction2) {
......@@ -11530,14 +11527,14 @@ function useScrollViewLoader(props2, state2, scrollTopNumber, scrollLeftNumber,
console.error(`id error: scroll-into-view=${val}`);
return;
}
var element = rootRef.value.querySelector("#" + val);
let element = rootRef.value.querySelector("#" + val);
if (element) {
var mainRect = main.value.getBoundingClientRect();
var elRect = element.getBoundingClientRect();
let mainRect = main.value.getBoundingClientRect();
let elRect = element.getBoundingClientRect();
if (props2.scrollX) {
var left = elRect.left - mainRect.left;
var scrollLeft = main.value.scrollLeft;
var x = scrollLeft + left;
let left = elRect.left - mainRect.left;
let scrollLeft = main.value.scrollLeft;
let x = scrollLeft + left;
if (props2.scrollWithAnimation) {
scrollTo2(x, "x");
} else {
......@@ -11545,9 +11542,9 @@ function useScrollViewLoader(props2, state2, scrollTopNumber, scrollLeftNumber,
}
}
if (props2.scrollY) {
var top = elRect.top - mainRect.top;
var scrollTop = main.value.scrollTop;
var y = scrollTop + top;
let top = elRect.top - mainRect.top;
let scrollTop = main.value.scrollTop;
let y = scrollTop + top;
if (props2.scrollWithAnimation) {
scrollTo2(y, "y");
} else {
......@@ -11598,68 +11595,75 @@ function useScrollViewLoader(props2, state2, scrollTopNumber, scrollLeftNumber,
x: 0,
y: 0
};
let needStop = null;
let needStop = false;
let toUpperNumber = 0;
let triggerAbort = false;
let beforeRefreshing = false;
let __handleTouchMove = function(event) {
var x = event.touches[0].pageX;
var y = event.touches[0].pageY;
var _main = main.value;
if (needStop === null) {
if (Math.abs(x - touchStart.x) > Math.abs(y - touchStart.y)) {
if (self.scrollX) {
if (_main.scrollLeft === 0 && x > touchStart.x) {
needStop = false;
return;
} else if (_main.scrollWidth === _main.offsetWidth + _main.scrollLeft && x < touchStart.x) {
needStop = false;
return;
}
needStop = true;
} else {
let x = event.touches[0].pageX;
let y = event.touches[0].pageY;
let _main = main.value;
if (Math.abs(x - touchStart.x) > Math.abs(y - touchStart.y)) {
if (self.scrollX) {
if (_main.scrollLeft === 0 && x > touchStart.x) {
needStop = false;
return;
} else if (_main.scrollWidth === _main.offsetWidth + _main.scrollLeft && x < touchStart.x) {
needStop = false;
return;
}
needStop = true;
} else {
if (self.scrollY) {
if (_main.scrollTop === 0 && y > touchStart.y) {
needStop = false;
return;
} else if (_main.scrollHeight === _main.offsetHeight + _main.scrollTop && y < touchStart.y) {
needStop = false;
return;
}
needStop = false;
}
} else {
if (self.scrollY) {
if (props2.refresherEnabled && _main.scrollTop === 0 && y > touchStart.y) {
needStop = true;
} else {
if (event.cancelable !== false)
event.preventDefault();
} else if (_main.scrollHeight === _main.offsetHeight + _main.scrollTop && y < touchStart.y) {
needStop = false;
return;
}
needStop = true;
} else {
needStop = false;
}
}
if (needStop) {
event.stopPropagation();
}
if (_main.scrollTop === 0 && event.touches.length === 1) {
state2.refreshState = "pulling";
}
if (props2.refresherEnabled && state2.refreshState === "pulling") {
const dy = y - touchStart.y;
state2.refresherHeight = dy;
let rotate = dy / props2.refresherThreshold;
if (rotate > 1) {
rotate = 1;
if (toUpperNumber === 0) {
toUpperNumber = y;
}
if (!beforeRefreshing) {
state2.refresherHeight = y - toUpperNumber;
if (state2.refresherHeight > 0) {
triggerAbort = true;
trigger("refresherpulling", event, {
deltaY: dy
});
}
} else {
rotate = rotate * 360;
state2.refresherHeight = dy + props2.refresherThreshold;
triggerAbort = false;
}
state2.refreshRotate = rotate;
trigger("refresherpulling", event, {
deltaY: dy
});
const route = state2.refresherHeight / props2.refresherThreshold;
state2.refreshRotate = (route > 1 ? 1 : route) * 360;
}
};
let __handleTouchStart = function(event) {
if (event.touches.length === 1) {
needStop = null;
touchStart = {
x: event.touches[0].pageX,
y: event.touches[0].pageY
};
if (props2.refresherEnabled && state2.refreshState !== "refreshing" && main.value.scrollTop === 0) {
state2.refreshState = "pulling";
}
}
};
let __handleTouchEnd = function(event) {
......@@ -11668,14 +11672,24 @@ function useScrollViewLoader(props2, state2, scrollTopNumber, scrollLeftNumber,
y: 0
};
if (state2.refresherHeight >= props2.refresherThreshold) {
state2.refresherHeight = props2.refresherThreshold;
state2.refreshState = "refreshing";
if (beforeRefreshing)
return;
beforeRefreshing = true;
_setRefreshState("refreshing");
} else {
state2.refresherHeight = 0;
trigger("refresherabort", event, {});
beforeRefreshing = false;
state2.refreshState = "refresherabort";
state2.refresherHeight = toUpperNumber = 0;
if (triggerAbort) {
triggerAbort = false;
trigger("refresherabort", event, {});
}
}
};
main.value.addEventListener("touchstart", __handleTouchStart, passiveOptions);
main.value.addEventListener("touchmove", __handleTouchMove, passiveOptions);
main.value.addEventListener("touchmove", __handleTouchMove);
main.value.addEventListener("scroll", __handleScroll, passiveOptions);
main.value.addEventListener("touchend", __handleTouchEnd, passiveOptions);
onBeforeUnmount(() => {
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或