diff --git a/dist/field/index.js b/dist/field/index.js
index fd3472dc..105ba28f 100644
--- a/dist/field/index.js
+++ b/dist/field/index.js
@@ -36,6 +36,10 @@ VantComponent({
type: Boolean,
observer: 'setShowClear',
},
+ clearTrigger: {
+ type: String,
+ value: 'focus',
+ },
border: {
type: Boolean,
value: true,
@@ -44,6 +48,10 @@ VantComponent({
type: String,
value: '6.2em',
},
+ clearIcon: {
+ type: String,
+ value: 'clear',
+ },
}
),
data: {
@@ -115,11 +123,16 @@ VantComponent({
});
},
setShowClear() {
- const { clearable, readonly } = this.data;
+ const { clearable, readonly, clearTrigger } = this.data;
const { focused, value } = this;
- this.setData({
- showClear: !!clearable && !!focused && !!value && !readonly,
- });
+ let showClear = false;
+ if (clearable && !readonly) {
+ const hasValue = !!value;
+ const trigger =
+ clearTrigger === 'always' || (clearTrigger === 'focus' && focused);
+ showClear = hasValue && trigger;
+ }
+ this.setData({ showClear });
},
noop() {},
},
diff --git a/dist/field/index.wxml b/dist/field/index.wxml
index 08eee019..ec2e0ea8 100644
--- a/dist/field/index.wxml
+++ b/dist/field/index.wxml
@@ -29,7 +29,7 @@
diff --git a/dist/mixins/page-scroll.js b/dist/mixins/page-scroll.js
index 9e4a5f36..4b0f2a5c 100644
--- a/dist/mixins/page-scroll.js
+++ b/dist/mixins/page-scroll.js
@@ -1,4 +1,4 @@
-import { getCurrentPage } from '../common/utils';
+import { getCurrentPage, isDef } from '../common/utils';
function onPageScroll(event) {
const { vanPageScroller = [] } = getCurrentPage();
vanPageScroller.forEach((scroller) => {
@@ -25,9 +25,11 @@ export const pageScrollMixin = (scroller) =>
detached() {
var _a;
const page = getCurrentPage();
- page.vanPageScroller =
- ((_a = page.vanPageScroller) === null || _a === void 0
- ? void 0
- : _a.filter((item) => item !== scroller)) || [];
+ if (!isDef(page)) {
+ page.vanPageScroller =
+ ((_a = page.vanPageScroller) === null || _a === void 0
+ ? void 0
+ : _a.filter((item) => item !== scroller)) || [];
+ }
},
});
diff --git a/dist/search/index.js b/dist/search/index.js
index da3d958b..22544e8f 100644
--- a/dist/search/index.js
+++ b/dist/search/index.js
@@ -41,6 +41,14 @@ VantComponent({
type: Boolean,
value: true,
},
+ clearTrigger: {
+ type: String,
+ value: 'focus',
+ },
+ clearIcon: {
+ type: String,
+ value: 'clear',
+ },
},
methods: {
onChange(event) {
diff --git a/dist/search/index.wxml b/dist/search/index.wxml
index 5d77fca8..0068cfe7 100644
--- a/dist/search/index.wxml
+++ b/dist/search/index.wxml
@@ -21,6 +21,8 @@
disabled="{{ disabled }}"
readonly="{{ readonly }}"
clearable="{{ clearable }}"
+ clear-trigger="{{ clearTrigger }}"
+ clear-icon="{{ clearIcon }}"
maxlength="{{ maxlength }}"
input-align="{{ inputAlign }}"
input-class="input-class"
diff --git a/dist/slider/index.js b/dist/slider/index.js
index 97d2e7b7..88916a9c 100644
--- a/dist/slider/index.js
+++ b/dist/slider/index.js
@@ -5,6 +5,7 @@ import { getRect } from '../common/utils';
VantComponent({
mixins: [touch],
props: {
+ range: Boolean,
disabled: Boolean,
useButtonSlot: Boolean,
activeColor: String,
@@ -24,6 +25,7 @@ VantComponent({
value: {
type: Number,
value: 0,
+ optionalTypes: [Array],
observer(val) {
if (val !== this.value) {
this.updateValue(val);
@@ -38,8 +40,18 @@ VantComponent({
methods: {
onTouchStart(event) {
if (this.data.disabled) return;
+ const { index } = event.currentTarget.dataset;
+ if (typeof index === 'number') {
+ this.buttonIndex = index;
+ }
this.touchStart(event);
this.startValue = this.format(this.value);
+ this.newValue = this.value;
+ if (this.isRange(this.newValue)) {
+ this.startValue = this.newValue.map((val) => this.format(val));
+ } else {
+ this.startValue = this.format(this.newValue);
+ }
this.dragStatus = 'start';
},
onTouchMove(event) {
@@ -51,7 +63,12 @@ VantComponent({
this.dragStatus = 'draging';
getRect(this, '.van-slider').then((rect) => {
const diff = (this.deltaX / rect.width) * this.getRange();
- this.newValue = this.startValue + diff;
+ if (this.isRange(this.startValue)) {
+ this.newValue[this.buttonIndex] =
+ this.startValue[this.buttonIndex] + diff;
+ } else {
+ this.newValue = this.startValue + diff;
+ }
this.updateValue(this.newValue, false, true);
});
},
@@ -68,17 +85,40 @@ VantComponent({
getRect(this, '.van-slider').then((rect) => {
const value =
((event.detail.x - rect.left) / rect.width) * this.getRange() + min;
- this.updateValue(value, true);
+ if (this.isRange(this.value)) {
+ const [left, right] = this.value;
+ const middle = (left + right) / 2;
+ if (value <= middle) {
+ this.updateValue([value, right], true);
+ } else {
+ this.updateValue([left, value], true);
+ }
+ } else {
+ this.updateValue(value, true);
+ }
});
},
+ isRange(val) {
+ const { range } = this.data;
+ return range && Array.isArray(val);
+ },
+ handleOverlap(value) {
+ if (value[0] > value[1]) {
+ return value.slice(0).reverse();
+ }
+ return value;
+ },
updateValue(value, end, drag) {
- value = this.format(value);
- const { min } = this.data;
- const width = `${((value - min) * 100) / this.getRange()}%`;
+ if (this.isRange(value)) {
+ value = this.handleOverlap(value).map((val) => this.format(val));
+ } else {
+ value = this.format(value);
+ }
this.value = value;
this.setData({
barStyle: `
- width: ${width};
+ width: ${this.calcMainAxis()};
+ left: ${this.isRange(value) ? `${value[0]}%` : 0};
${drag ? 'transition: none;' : ''}
`,
});
@@ -92,10 +132,23 @@ VantComponent({
this.setData({ value });
}
},
+ getScope() {
+ return Number(this.data.max) - Number(this.data.min);
+ },
getRange() {
const { max, min } = this.data;
return max - min;
},
+ // 计算选中条的长度百分比
+ calcMainAxis() {
+ const { value } = this;
+ const { min } = this.data;
+ const scope = this.getScope();
+ if (this.isRange(value)) {
+ return `${((value[1] - value[0]) * 100) / scope}%`;
+ }
+ return `${((value - Number(min)) * 100) / scope}%`;
+ },
format(value) {
const { max, min, step } = this.data;
return Math.round(Math.max(min, Math.min(value, max)) / step) * step;
diff --git a/dist/slider/index.wxml b/dist/slider/index.wxml
index 11908eda..7129a5bc 100644
--- a/dist/slider/index.wxml
+++ b/dist/slider/index.wxml
@@ -11,6 +11,44 @@
style="{{ barStyle }}; {{ style({ backgroundColor: activeColor }) }}"
>
+
+
+
+
+
+
+
+
+
diff --git a/lib/mixins/page-scroll.js b/lib/mixins/page-scroll.js
index 9a3c055f..145639ee 100644
--- a/lib/mixins/page-scroll.js
+++ b/lib/mixins/page-scroll.js
@@ -29,12 +29,14 @@ var pageScrollMixin = function (scroller) {
detached: function () {
var _a;
var page = utils_1.getCurrentPage();
- page.vanPageScroller =
- ((_a = page.vanPageScroller) === null || _a === void 0
- ? void 0
- : _a.filter(function (item) {
- return item !== scroller;
- })) || [];
+ if (!utils_1.isDef(page)) {
+ page.vanPageScroller =
+ ((_a = page.vanPageScroller) === null || _a === void 0
+ ? void 0
+ : _a.filter(function (item) {
+ return item !== scroller;
+ })) || [];
+ }
},
});
};
diff --git a/lib/search/index.js b/lib/search/index.js
index d2ba33b9..93945615 100644
--- a/lib/search/index.js
+++ b/lib/search/index.js
@@ -43,6 +43,14 @@ component_1.VantComponent({
type: Boolean,
value: true,
},
+ clearTrigger: {
+ type: String,
+ value: 'focus',
+ },
+ clearIcon: {
+ type: String,
+ value: 'clear',
+ },
},
methods: {
onChange: function (event) {
diff --git a/lib/search/index.wxml b/lib/search/index.wxml
index 5d77fca8..0068cfe7 100644
--- a/lib/search/index.wxml
+++ b/lib/search/index.wxml
@@ -21,6 +21,8 @@
disabled="{{ disabled }}"
readonly="{{ readonly }}"
clearable="{{ clearable }}"
+ clear-trigger="{{ clearTrigger }}"
+ clear-icon="{{ clearIcon }}"
maxlength="{{ maxlength }}"
input-align="{{ inputAlign }}"
input-class="input-class"
diff --git a/lib/slider/index.js b/lib/slider/index.js
index baf56bc6..3976beca 100644
--- a/lib/slider/index.js
+++ b/lib/slider/index.js
@@ -7,6 +7,7 @@ var utils_1 = require('../common/utils');
component_1.VantComponent({
mixins: [touch_1.touch],
props: {
+ range: Boolean,
disabled: Boolean,
useButtonSlot: Boolean,
activeColor: String,
@@ -26,6 +27,7 @@ component_1.VantComponent({
value: {
type: Number,
value: 0,
+ optionalTypes: [Array],
observer: function (val) {
if (val !== this.value) {
this.updateValue(val);
@@ -39,9 +41,22 @@ component_1.VantComponent({
},
methods: {
onTouchStart: function (event) {
+ var _this = this;
if (this.data.disabled) return;
+ var index = event.currentTarget.dataset.index;
+ if (typeof index === 'number') {
+ this.buttonIndex = index;
+ }
this.touchStart(event);
this.startValue = this.format(this.value);
+ this.newValue = this.value;
+ if (this.isRange(this.newValue)) {
+ this.startValue = this.newValue.map(function (val) {
+ return _this.format(val);
+ });
+ } else {
+ this.startValue = this.format(this.newValue);
+ }
this.dragStatus = 'start';
},
onTouchMove: function (event) {
@@ -54,7 +69,12 @@ component_1.VantComponent({
this.dragStatus = 'draging';
utils_1.getRect(this, '.van-slider').then(function (rect) {
var diff = (_this.deltaX / rect.width) * _this.getRange();
- _this.newValue = _this.startValue + diff;
+ if (_this.isRange(_this.startValue)) {
+ _this.newValue[_this.buttonIndex] =
+ _this.startValue[_this.buttonIndex] + diff;
+ } else {
+ _this.newValue = _this.startValue + diff;
+ }
_this.updateValue(_this.newValue, false, true);
});
},
@@ -72,18 +92,47 @@ component_1.VantComponent({
utils_1.getRect(this, '.van-slider').then(function (rect) {
var value =
((event.detail.x - rect.left) / rect.width) * _this.getRange() + min;
- _this.updateValue(value, true);
+ if (_this.isRange(_this.value)) {
+ var _a = _this.value,
+ left = _a[0],
+ right = _a[1];
+ var middle = (left + right) / 2;
+ if (value <= middle) {
+ _this.updateValue([value, right], true);
+ } else {
+ _this.updateValue([left, value], true);
+ }
+ } else {
+ _this.updateValue(value, true);
+ }
});
},
+ isRange: function (val) {
+ var range = this.data.range;
+ return range && Array.isArray(val);
+ },
+ handleOverlap: function (value) {
+ if (value[0] > value[1]) {
+ return value.slice(0).reverse();
+ }
+ return value;
+ },
updateValue: function (value, end, drag) {
- value = this.format(value);
- var min = this.data.min;
- var width = ((value - min) * 100) / this.getRange() + '%';
+ var _this = this;
+ if (this.isRange(value)) {
+ value = this.handleOverlap(value).map(function (val) {
+ return _this.format(val);
+ });
+ } else {
+ value = this.format(value);
+ }
this.value = value;
this.setData({
barStyle:
'\n width: ' +
- width +
+ this.calcMainAxis() +
+ ';\n left: ' +
+ (this.isRange(value) ? value[0] + '%' : 0) +
';\n ' +
(drag ? 'transition: none;' : '') +
'\n ',
@@ -98,12 +147,25 @@ component_1.VantComponent({
this.setData({ value: value });
}
},
+ getScope: function () {
+ return Number(this.data.max) - Number(this.data.min);
+ },
getRange: function () {
var _a = this.data,
max = _a.max,
min = _a.min;
return max - min;
},
+ // 计算选中条的长度百分比
+ calcMainAxis: function () {
+ var value = this.value;
+ var min = this.data.min;
+ var scope = this.getScope();
+ if (this.isRange(value)) {
+ return ((value[1] - value[0]) * 100) / scope + '%';
+ }
+ return ((value - Number(min)) * 100) / scope + '%';
+ },
format: function (value) {
var _a = this.data,
max = _a.max,
diff --git a/lib/slider/index.wxml b/lib/slider/index.wxml
index 11908eda..7129a5bc 100644
--- a/lib/slider/index.wxml
+++ b/lib/slider/index.wxml
@@ -11,6 +11,44 @@
style="{{ barStyle }}; {{ style({ backgroundColor: activeColor }) }}"
>
+
+
+
+
+
+
+
+
+