mirror of
https://gitee.com/vant-contrib/vant.git
synced 2026-07-13 17:21:07 +08:00
Compare commits
No commits in common. "c1bdba5213de7c389a5a538ad920dd037c7f574b" and "ec2ff5927083dcb9819f111e874bed29c8a5606a" have entirely different histories.
c1bdba5213
...
ec2ff59270
@ -6,38 +6,30 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-address-edit__fields">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Name
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Name"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Phone
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Phone"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -47,20 +39,16 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Area
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Area"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -69,19 +57,15 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field van-address-edit-detail">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Address
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<textarea id="van-field-input"
|
||||
rows="1"
|
||||
<textarea rows="1"
|
||||
class="van-field__control"
|
||||
placeholder="Address"
|
||||
aria-labelledby="van-field-label"
|
||||
style="height: auto;"
|
||||
>
|
||||
</textarea>
|
||||
@ -90,19 +74,15 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Postal
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Postal"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -11,38 +11,30 @@ exports[`should render AddressEdit correctly 1`] = `
|
||||
<div class="van-address-edit__fields">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Name
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Name"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Phone
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Phone"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -52,20 +44,16 @@ exports[`should render AddressEdit correctly 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Area
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Area"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -74,19 +62,15 @@ exports[`should render AddressEdit correctly 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field van-address-edit-detail">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Address
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<textarea id="van-field-input"
|
||||
rows="1"
|
||||
<textarea rows="1"
|
||||
class="van-field__control"
|
||||
placeholder="Address"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</textarea>
|
||||
</div>
|
||||
@ -112,38 +96,30 @@ exports[`should render AddressEdit with props correctly 1`] = `
|
||||
<div class="van-address-edit__fields">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Name
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Name"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Phone
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Phone"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -153,20 +129,16 @@ exports[`should render AddressEdit with props correctly 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Area
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Area"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -175,19 +147,15 @@ exports[`should render AddressEdit with props correctly 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field van-address-edit-detail">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Address
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<textarea id="van-field-input"
|
||||
rows="1"
|
||||
<textarea rows="1"
|
||||
class="van-field__control"
|
||||
placeholder="Address"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</textarea>
|
||||
</div>
|
||||
@ -195,19 +163,15 @@ exports[`should render AddressEdit with props correctly 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Postal
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Postal"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -245,19 +209,15 @@ exports[`should render AddressEdit with props correctly 1`] = `
|
||||
exports[`should valid address detail and render error message correctly 1`] = `
|
||||
<div class="van-cell van-field van-address-edit-detail">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Address
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<textarea id="van-field-input"
|
||||
rows="1"
|
||||
<textarea rows="1"
|
||||
class="van-field__control"
|
||||
placeholder="Address"
|
||||
aria-labelledby="van-field-label"
|
||||
style="height: auto;"
|
||||
>
|
||||
</textarea>
|
||||
@ -275,20 +235,16 @@ exports[`should valid area code and render error message correctly 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Area
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Area"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
<div class="van-field__error-message">
|
||||
@ -303,19 +259,15 @@ exports[`should valid area code and render error message correctly 1`] = `
|
||||
exports[`should valid name and render error message correctly 1`] = `
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Name
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Name"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
<div class="van-field__error-message">
|
||||
@ -328,19 +280,15 @@ exports[`should valid name and render error message correctly 1`] = `
|
||||
exports[`should valid postal code and render error message correctly 1`] = `
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Postal
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Postal"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
<div class="van-field__error-message">
|
||||
@ -353,19 +301,15 @@ exports[`should valid postal code and render error message correctly 1`] = `
|
||||
exports[`should valid tel and render error message correctly 1`] = `
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Phone
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Phone"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
<div class="van-field__error-message">
|
||||
|
||||
@ -7,20 +7,16 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Area
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Select Area"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -34,20 +30,16 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Area
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Select Area"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -61,20 +53,16 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Area
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Select Area"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -88,20 +76,16 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Area
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Select Area"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -115,20 +99,16 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Area
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Select Area"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -62,8 +62,7 @@ exports[`should update tabs when previous tab is clicked 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line van-tabs__nav--complete"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-cascader__tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
@ -72,8 +71,7 @@ exports[`should update tabs when previous tab is clicked 1`] = `
|
||||
Jiangsu
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active van-cascader__tab van-cascader__tab--unselected"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
@ -94,11 +92,8 @@ exports[`should update tabs when previous tab is clicked 1`] = `
|
||||
class="van-swipe__track"
|
||||
>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper van-tab__pane-wrapper--inactive"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="-1"
|
||||
aria-hidden="true"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div class="van-tab__pane">
|
||||
@ -119,11 +114,8 @@ exports[`should update tabs when previous tab is clicked 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="0"
|
||||
aria-hidden="false"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div class="van-tab__pane">
|
||||
|
||||
@ -1,15 +0,0 @@
|
||||
import { getCurrentInstance } from 'vue';
|
||||
|
||||
let current = 0;
|
||||
|
||||
export function useId() {
|
||||
const vm = getCurrentInstance();
|
||||
const { name = 'unknown' } = vm?.type || {};
|
||||
|
||||
// keep jest snapshot stable
|
||||
if (process.env.NODE_ENV === 'test') {
|
||||
return name;
|
||||
}
|
||||
|
||||
return `${name}-${++current}`;
|
||||
}
|
||||
@ -5,9 +5,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<form class="van-form">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Rate
|
||||
</label>
|
||||
</div>
|
||||
@ -77,9 +75,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Slider
|
||||
</label>
|
||||
</div>
|
||||
@ -127,9 +123,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<form class="van-form">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Rate
|
||||
</label>
|
||||
</div>
|
||||
@ -199,9 +193,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Slider
|
||||
</label>
|
||||
</div>
|
||||
|
||||
@ -6,38 +6,30 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-contact-edit__fields">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Name
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Name"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Phone
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Phone"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -7,7 +7,6 @@ exports[`should be the sames as the last snapshot when render coupon list 1`] =
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Coupon code"
|
||||
>
|
||||
@ -31,23 +30,19 @@ exports[`should be the sames as the last snapshot when render coupon list 1`] =
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Available (6)
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Unavailable (2)
|
||||
@ -60,11 +55,8 @@ exports[`should be the sames as the last snapshot when render coupon list 1`] =
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style
|
||||
>
|
||||
<div class="van-coupon-list__list van-coupon-list__list--with-bottom"
|
||||
@ -268,11 +260,8 @@ exports[`should be the sames as the last snapshot when render coupon list 1`] =
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
@ -299,7 +288,6 @@ exports[`should have two "van-coupon-list__empty" classes when render coupon lis
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Coupon code"
|
||||
>
|
||||
@ -323,23 +311,19 @@ exports[`should have two "van-coupon-list__empty" classes when render coupon lis
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Available (0)
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Unavailable (0)
|
||||
@ -352,11 +336,8 @@ exports[`should have two "van-coupon-list__empty" classes when render coupon lis
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="display: none;"
|
||||
>
|
||||
<div class="van-coupon-list__list van-coupon-list__list--with-bottom"
|
||||
@ -370,11 +351,8 @@ exports[`should have two "van-coupon-list__empty" classes when render coupon lis
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style
|
||||
>
|
||||
<div class="van-coupon-list__list van-coupon-list__list--with-bottom"
|
||||
@ -411,7 +389,6 @@ exports[`should render list-footer slot correctly 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Coupon code"
|
||||
>
|
||||
@ -435,23 +412,19 @@ exports[`should render list-footer slot correctly 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Available (0)
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Unavailable (0)
|
||||
@ -464,11 +437,8 @@ exports[`should render list-footer slot correctly 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="display: none;"
|
||||
>
|
||||
<div class="van-coupon-list__list van-coupon-list__list--with-bottom"
|
||||
@ -483,11 +453,8 @@ exports[`should render list-footer slot correctly 1`] = `
|
||||
List Footer
|
||||
</div>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style
|
||||
>
|
||||
<div class="van-coupon-list__list van-coupon-list__list--with-bottom"
|
||||
@ -525,7 +492,6 @@ exports[`should use custom src when using empty-image prop 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Coupon code"
|
||||
>
|
||||
@ -549,23 +515,19 @@ exports[`should use custom src when using empty-image prop 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Available (0)
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Unavailable (0)
|
||||
@ -578,11 +540,8 @@ exports[`should use custom src when using empty-image prop 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style
|
||||
>
|
||||
<div class="van-coupon-list__list van-coupon-list__list--with-bottom"
|
||||
@ -596,11 +555,8 @@ exports[`should use custom src when using empty-image prop 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
|
||||
@ -18,34 +18,28 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Error
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Network
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Search
|
||||
@ -58,11 +52,8 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style
|
||||
>
|
||||
<div class="van-empty">
|
||||
@ -74,19 +65,13 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
|
||||
@ -39,7 +39,6 @@ import { cellSharedProps } from '../cell/Cell';
|
||||
|
||||
// Composables
|
||||
import { CUSTOM_FIELD_INJECTION_KEY, useParent } from '@vant/use';
|
||||
import { useId } from '../composables/use-id';
|
||||
import { useExpose } from '../composables/use-expose';
|
||||
|
||||
// Components
|
||||
@ -129,7 +128,6 @@ export default defineComponent({
|
||||
],
|
||||
|
||||
setup(props, { emit, slots }) {
|
||||
const id = useId();
|
||||
const state = reactive({
|
||||
focused: false,
|
||||
validateFailed: false,
|
||||
@ -378,8 +376,6 @@ export default defineComponent({
|
||||
emit('keypress', event);
|
||||
};
|
||||
|
||||
const getInputId = () => props.id || `${id}-input`;
|
||||
|
||||
const renderInput = () => {
|
||||
const controlClass = bem('control', [
|
||||
getProp('inputAlign'),
|
||||
@ -399,7 +395,7 @@ export default defineComponent({
|
||||
}
|
||||
|
||||
const inputAttrs = {
|
||||
id: getInputId(),
|
||||
id: props.id,
|
||||
ref: inputRef,
|
||||
name: props.name,
|
||||
rows: props.rows !== undefined ? +props.rows : undefined,
|
||||
@ -410,7 +406,6 @@ export default defineComponent({
|
||||
autofocus: props.autofocus,
|
||||
placeholder: props.placeholder,
|
||||
autocomplete: props.autocomplete,
|
||||
'aria-labelledby': props.label ? `${id}-label` : undefined,
|
||||
onBlur,
|
||||
onFocus,
|
||||
onInput,
|
||||
@ -496,11 +491,7 @@ export default defineComponent({
|
||||
return [slots.label(), colon];
|
||||
}
|
||||
if (props.label) {
|
||||
return (
|
||||
<label id={`${id}-label`} for={getInputId()}>
|
||||
{props.label + colon}
|
||||
</label>
|
||||
);
|
||||
return <label for={props.id}>{props.label + colon}</label>;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@ -250,7 +250,7 @@ Use `input-align` prop to align the input value.
|
||||
| v-model | Input value | _number \| string_ | - |
|
||||
| label | Left side label | _string_ | - |
|
||||
| name | As the identifier when submitting the form | _string_ | - |
|
||||
| id `v3.2.2` | Input id, the for attribute of the label also will be set | _string_ | `van-field-n-input` |
|
||||
| id `v3.2.2` | Input id, the for attribute of the label also will be set | _string_ | - |
|
||||
| type | Input type, can be set to `tel` `digit`<br>`number` `textarea` `password` | _string_ | `text` |
|
||||
| size | Size，can be set to `large` | _string_ | - |
|
||||
| maxlength | Max length of value | _number \| string_ | - |
|
||||
|
||||
@ -269,7 +269,7 @@ export default {
|
||||
| v-model | 当前输入的值 | _number \| string_ | - |
|
||||
| label | 输入框左侧文本 | _string_ | - |
|
||||
| name | 名称，作为提交表单时的标识符 | _string_ | - |
|
||||
| id `v3.2.2` | 输入框 id，同时会设置 label 的 for 属性 | _string_ | `van-field-n-input` |
|
||||
| id `v3.2.2` | 输入框 id，同时会设置 label 的 for 属性 | _string_ | - |
|
||||
| type | 输入框类型, 可选值为 `tel` `digit`<br>`number` `textarea` `password` 等 | _string_ | `text` |
|
||||
| size | 大小，可选值为 `large` | _string_ | - |
|
||||
| maxlength | 输入的最大字符数 | _number \| string_ | - |
|
||||
|
||||
@ -5,19 +5,15 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Label
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Text"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -28,47 +24,37 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Text
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Text"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Phone
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Phone"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Digit
|
||||
</label>
|
||||
</div>
|
||||
@ -76,19 +62,15 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-field__body">
|
||||
<input type="tel"
|
||||
inputmode="numeric"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Digit"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Number
|
||||
</label>
|
||||
</div>
|
||||
@ -96,29 +78,23 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
inputmode="decimal"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Number"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Password
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="password"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Password"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -129,38 +105,30 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Text
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field van-field--disabled">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Text
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
disabled
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -175,19 +143,15 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</i>
|
||||
</div>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Text
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Show Icon"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
<div class="van-field__right-icon">
|
||||
<i class="van-badge__wrapper van-icon van-icon-warning-o">
|
||||
@ -202,19 +166,15 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</i>
|
||||
</div>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Text
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Show Clear Icon"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -225,38 +185,30 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-field van-field--error">
|
||||
<div class="van-cell__title van-field__label van-field__label--required">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Username
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control van-field__control--error"
|
||||
placeholder="Username"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label van-field__label--required">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Phone
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Phone"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
<div class="van-field__error-message">
|
||||
@ -270,19 +222,15 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-cell--center van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
SMS
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="SMS"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
<div class="van-field__button">
|
||||
<button type="button"
|
||||
@ -304,38 +252,30 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Text
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Format On Change"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Text
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Format On Blur"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -347,8 +287,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<textarea id="van-field-input"
|
||||
rows="1"
|
||||
<textarea rows="1"
|
||||
class="van-field__control"
|
||||
placeholder="Message"
|
||||
style="height: auto;"
|
||||
@ -363,19 +302,15 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Message
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<textarea id="van-field-input"
|
||||
rows="2"
|
||||
<textarea rows="2"
|
||||
class="van-field__control"
|
||||
placeholder="Message"
|
||||
aria-labelledby="van-field-label"
|
||||
style="height: auto;"
|
||||
>
|
||||
</textarea>
|
||||
@ -394,19 +329,15 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Text
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control van-field__control--right"
|
||||
placeholder="Input Align Right"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -7,9 +7,7 @@ exports[`should change clear icon when using clear-icon prop 1`] = `
|
||||
|
||||
exports[`should render colon when using colon prop 1`] = `
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
foo:
|
||||
</label>
|
||||
</div>
|
||||
@ -26,7 +24,6 @@ exports[`should render extra slot correctly 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
>
|
||||
</div>
|
||||
@ -51,8 +48,7 @@ exports[`should render textarea when type is textarea 1`] = `
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<textarea id="van-field-input"
|
||||
class="van-field__control"
|
||||
<textarea class="van-field__control"
|
||||
style="height: auto;"
|
||||
>
|
||||
</textarea>
|
||||
@ -66,7 +62,6 @@ exports[`should render word limit correctly 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
>
|
||||
</div>
|
||||
@ -85,7 +80,6 @@ exports[`should render word limit correctly when modelValue is null 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
>
|
||||
</div>
|
||||
@ -104,7 +98,6 @@ exports[`should render word limit correctly when modelValue is undefined 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
>
|
||||
</div>
|
||||
|
||||
@ -6,40 +6,32 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Username
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="username"
|
||||
class="van-field__control"
|
||||
placeholder="Username"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Password
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="password"
|
||||
id="van-field-input"
|
||||
name="password"
|
||||
class="van-field__control"
|
||||
placeholder="Password"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -63,80 +55,64 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Label
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="pattern"
|
||||
class="van-field__control"
|
||||
placeholder="Use pattern"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Label
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="validator"
|
||||
class="van-field__control"
|
||||
placeholder="Use validator"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Label
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="validatorMessage"
|
||||
class="van-field__control"
|
||||
placeholder="Use validator to return message"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Label
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="asyncValidator"
|
||||
class="van-field__control"
|
||||
placeholder="Use async validator"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -160,9 +136,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell-group van-cell-group--inset">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Switch
|
||||
</label>
|
||||
</div>
|
||||
@ -183,9 +157,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Checkbox
|
||||
</label>
|
||||
</div>
|
||||
@ -208,9 +180,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Checkbox Group
|
||||
</label>
|
||||
</div>
|
||||
@ -251,9 +221,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Radio
|
||||
</label>
|
||||
</div>
|
||||
@ -296,9 +264,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Stepper
|
||||
</label>
|
||||
</div>
|
||||
@ -332,9 +298,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Rate
|
||||
</label>
|
||||
</div>
|
||||
@ -404,9 +368,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Slider
|
||||
</label>
|
||||
</div>
|
||||
@ -436,9 +398,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Uploader
|
||||
</label>
|
||||
</div>
|
||||
@ -482,21 +442,17 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Picker
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="picker"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Select city"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -508,21 +464,17 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Datetime Picker
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="datetimePicker"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Select time"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -534,21 +486,17 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Area Picker
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="area"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Select area"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -560,21 +508,17 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Calendar
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="calendar"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Select date"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -6,7 +6,6 @@ exports[`should emit failed event when validating failed 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="A"
|
||||
class="van-field__control"
|
||||
>
|
||||
@ -20,7 +19,6 @@ exports[`should emit failed event when validating failed 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="B"
|
||||
class="van-field__control"
|
||||
>
|
||||
|
||||
@ -4,18 +4,14 @@ exports[`should render colon when using colon prop 1`] = `
|
||||
<form class="van-form">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Label:
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -27,7 +23,6 @@ exports[`should render colon when using colon prop 1`] = `
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
>
|
||||
</div>
|
||||
@ -42,7 +37,6 @@ exports[`should render error-message-align prop correctly 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
>
|
||||
</div>
|
||||
@ -60,7 +54,6 @@ exports[`should render input-align prop correctly 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control van-field__control--right"
|
||||
>
|
||||
</div>
|
||||
@ -83,36 +76,28 @@ exports[`should render label-align prop correctly 1`] = `
|
||||
<form class="van-form">
|
||||
<div class="van-cell van-field van-field--label-right">
|
||||
<div class="van-cell__title van-field__label van-field__label--right">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Label
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-cell van-field van-field--label-center">
|
||||
<div class="van-cell__title van-field__label van-field__label--center">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Label
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -126,18 +111,14 @@ exports[`should render label-width prop correctly 1`] = `
|
||||
<div class="van-cell__title van-field__label"
|
||||
style="width: 5rem;"
|
||||
>
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Label
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -146,18 +127,14 @@ exports[`should render label-width prop correctly 1`] = `
|
||||
<div class="van-cell__title van-field__label"
|
||||
style="width: 10vw;"
|
||||
>
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Label
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@ -171,7 +148,6 @@ exports[`should validate first field when using validate-first prop 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="A"
|
||||
class="van-field__control"
|
||||
>
|
||||
@ -185,7 +161,6 @@ exports[`should validate first field when using validate-first prop 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="B"
|
||||
class="van-field__control"
|
||||
>
|
||||
|
||||
@ -9,45 +9,37 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Demo
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Basic
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Outline
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-3"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Filled
|
||||
@ -62,11 +54,8 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style
|
||||
>
|
||||
<div>
|
||||
@ -141,27 +130,18 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-3"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
|
||||
@ -7,23 +7,19 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Basic Usage
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Custom Index List
|
||||
@ -36,11 +32,8 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style
|
||||
>
|
||||
<div class="van-index-bar">
|
||||
@ -908,11 +901,8 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
|
||||
@ -7,34 +7,28 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Basic Usage
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Error Info
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
PullRefresh
|
||||
@ -47,11 +41,8 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style
|
||||
>
|
||||
<div role="feed"
|
||||
@ -81,19 +72,13 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
|
||||
@ -79,20 +79,16 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Bind Value
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Click To Input"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -679,20 +679,16 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
City
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
placeholder="Choose City"
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -31,20 +31,16 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
tabindex="0"
|
||||
>
|
||||
<div class="van-cell__title van-field__label">
|
||||
<label id="van-field-label"
|
||||
for="van-field-input"
|
||||
>
|
||||
<label>
|
||||
Placement
|
||||
</label>
|
||||
</div>
|
||||
<div class="van-cell__value van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="text"
|
||||
id="van-field-input"
|
||||
name="picker"
|
||||
class="van-field__control"
|
||||
readonly
|
||||
aria-labelledby="van-field-label"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -7,34 +7,28 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Basic Usage
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Success Tip
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Custom Tips
|
||||
@ -47,11 +41,8 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style
|
||||
>
|
||||
<div class="van-pull-refresh">
|
||||
@ -66,19 +57,13 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
|
||||
@ -12,7 +12,6 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="search"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Placeholder"
|
||||
>
|
||||
@ -34,7 +33,6 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="search"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Placeholder"
|
||||
>
|
||||
@ -62,7 +60,6 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="search"
|
||||
id="van-field-input"
|
||||
class="van-field__control van-field__control--center"
|
||||
placeholder="Placeholder"
|
||||
>
|
||||
@ -83,7 +80,6 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="search"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
disabled
|
||||
placeholder="Placeholder"
|
||||
@ -107,7 +103,6 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="search"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Placeholder"
|
||||
>
|
||||
@ -131,7 +126,6 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="search"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
placeholder="Placeholder"
|
||||
>
|
||||
|
||||
@ -34,7 +34,6 @@ exports[`should render left slot correctly 1`] = `
|
||||
<div class="van-cell__value van-cell__value--alone van-field__value">
|
||||
<div class="van-field__body">
|
||||
<input type="search"
|
||||
id="van-field-input"
|
||||
class="van-field__control"
|
||||
>
|
||||
</div>
|
||||
|
||||
@ -22,8 +22,6 @@ import { TABS_KEY } from '../tabs/Tabs';
|
||||
|
||||
// Composables
|
||||
import { useParent } from '@vant/use';
|
||||
import { useId } from '../composables/use-id';
|
||||
import { useExpose } from '../composables/use-expose';
|
||||
import { routeProps } from '../composables/use-route';
|
||||
import { TAB_STATUS_KEY } from '../composables/use-tab-status';
|
||||
|
||||
@ -51,7 +49,6 @@ export default defineComponent({
|
||||
props: tabProps,
|
||||
|
||||
setup(props, { slots }) {
|
||||
const id = useId();
|
||||
const inited = ref(false);
|
||||
const { parent, index } = useParent(TABS_KEY);
|
||||
|
||||
@ -95,7 +92,6 @@ export default defineComponent({
|
||||
provide(TAB_STATUS_KEY, active);
|
||||
|
||||
return () => {
|
||||
const label = `${parent.id}-${index.value}`;
|
||||
const { animated, swipeable, scrollspy, lazyRender } = parent.props;
|
||||
|
||||
if (!slots.default && !animated) {
|
||||
@ -107,12 +103,9 @@ export default defineComponent({
|
||||
if (animated || swipeable) {
|
||||
return (
|
||||
<SwipeItem
|
||||
id={id}
|
||||
role="tabpanel"
|
||||
class={bem('pane-wrapper', { inactive: !active.value })}
|
||||
tabindex={active.value ? 0 : -1}
|
||||
aria-hidden={!active.value}
|
||||
aria-labelledby={label}
|
||||
class={bem('pane-wrapper', { inactive: !active.value })}
|
||||
>
|
||||
<div class={bem('pane')}>{slots.default?.()}</div>
|
||||
</SwipeItem>
|
||||
@ -122,17 +115,8 @@ export default defineComponent({
|
||||
const shouldRender = inited.value || scrollspy || !lazyRender;
|
||||
const Content = shouldRender ? slots.default?.() : null;
|
||||
|
||||
useExpose({ id });
|
||||
|
||||
return (
|
||||
<div
|
||||
v-show={show}
|
||||
id={id}
|
||||
role="tabpanel"
|
||||
class={bem('pane')}
|
||||
tabindex={show ? 0 : -1}
|
||||
aria-labelledby={label}
|
||||
>
|
||||
<div v-show={show} role="tabpanel" class={bem('pane')}>
|
||||
{Content}
|
||||
</div>
|
||||
);
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -2,19 +2,13 @@
|
||||
|
||||
exports[`should allow to disable lazy-render prop 1`] = `
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
@ -23,20 +17,14 @@ exports[`should allow to disable lazy-render prop 1`] = `
|
||||
|
||||
exports[`should allow to disable lazy-render prop 2`] = `
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style
|
||||
>
|
||||
Text
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
Text
|
||||
@ -51,34 +39,28 @@ exports[`should allow to set name prop 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
title1
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
title2
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--disabled"
|
||||
aria-selected="false"
|
||||
aria-disabled="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
title3
|
||||
@ -91,28 +73,19 @@ exports[`should allow to set name prop 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style
|
||||
>
|
||||
Text
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
@ -130,12 +103,9 @@ DOMWrapper {
|
||||
"_values": Object {},
|
||||
},
|
||||
"wrapperElement": <div
|
||||
aria-labelledby="van-tabs-0"
|
||||
class="van-tab__pane"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
style=""
|
||||
tabindex="0"
|
||||
>
|
||||
|
||||
Text
|
||||
@ -150,12 +120,10 @@ exports[`should not render empty tab 1`] = `
|
||||
`;
|
||||
|
||||
exports[`should render badge prop correctly 1`] = `
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<div class="van-badge__wrapper">
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
@ -174,12 +142,10 @@ exports[`should render nav-left、nav-right slot correctly 1`] = `
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
Custom nav left
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
Title
|
||||
@ -201,34 +167,28 @@ exports[`should switch tab after click the tab title 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
title1
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
title2
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--disabled"
|
||||
aria-selected="false"
|
||||
aria-disabled="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
title3
|
||||
@ -241,28 +201,19 @@ exports[`should switch tab after click the tab title 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style
|
||||
>
|
||||
Text
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
@ -277,34 +228,28 @@ exports[`should switch tab after click the tab title 2`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
title1
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
title2
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--disabled"
|
||||
aria-selected="false"
|
||||
aria-disabled="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
title3
|
||||
@ -317,29 +262,20 @@ exports[`should switch tab after click the tab title 2`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="display: none;"
|
||||
>
|
||||
Text
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style
|
||||
>
|
||||
Text
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
@ -354,8 +290,7 @@ exports[`swipe switch tab after swiping tab content 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
@ -364,8 +299,7 @@ exports[`swipe switch tab after swiping tab content 1`] = `
|
||||
title1
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
@ -374,8 +308,7 @@ exports[`swipe switch tab after swiping tab content 1`] = `
|
||||
title2
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--disabled"
|
||||
aria-selected="false"
|
||||
aria-disabled="true"
|
||||
@ -396,11 +329,8 @@ exports[`swipe switch tab after swiping tab content 1`] = `
|
||||
class="van-swipe__track"
|
||||
>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="0"
|
||||
aria-hidden="false"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div class="van-tab__pane">
|
||||
@ -408,11 +338,8 @@ exports[`swipe switch tab after swiping tab content 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper van-tab__pane-wrapper--inactive"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="-1"
|
||||
aria-hidden="true"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div class="van-tab__pane">
|
||||
@ -420,11 +347,8 @@ exports[`swipe switch tab after swiping tab content 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper van-tab__pane-wrapper--inactive"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="-1"
|
||||
aria-hidden="true"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="width: 100px;"
|
||||
>
|
||||
</div>
|
||||
@ -441,8 +365,7 @@ exports[`swipe switch tab after swiping tab content 2`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
@ -451,8 +374,7 @@ exports[`swipe switch tab after swiping tab content 2`] = `
|
||||
title1
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
@ -461,8 +383,7 @@ exports[`swipe switch tab after swiping tab content 2`] = `
|
||||
title2
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--disabled"
|
||||
aria-selected="false"
|
||||
aria-disabled="true"
|
||||
@ -483,11 +404,8 @@ exports[`swipe switch tab after swiping tab content 2`] = `
|
||||
class="van-swipe__track"
|
||||
>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper van-tab__pane-wrapper--inactive"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="-1"
|
||||
aria-hidden="true"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div class="van-tab__pane">
|
||||
@ -495,11 +413,8 @@ exports[`swipe switch tab after swiping tab content 2`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="0"
|
||||
aria-hidden="false"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div class="van-tab__pane">
|
||||
@ -507,11 +422,8 @@ exports[`swipe switch tab after swiping tab content 2`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper van-tab__pane-wrapper--inactive"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="-1"
|
||||
aria-hidden="true"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div class="van-tab__pane">
|
||||
@ -531,8 +443,7 @@ exports[`swipe switch tab after swiping tab content 3`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
@ -541,8 +452,7 @@ exports[`swipe switch tab after swiping tab content 3`] = `
|
||||
title1
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
@ -551,8 +461,7 @@ exports[`swipe switch tab after swiping tab content 3`] = `
|
||||
title2
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--disabled"
|
||||
aria-selected="false"
|
||||
aria-disabled="true"
|
||||
@ -573,11 +482,8 @@ exports[`swipe switch tab after swiping tab content 3`] = `
|
||||
class="van-swipe__track"
|
||||
>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper van-tab__pane-wrapper--inactive"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="-1"
|
||||
aria-hidden="true"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div class="van-tab__pane">
|
||||
@ -585,11 +491,8 @@ exports[`swipe switch tab after swiping tab content 3`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="0"
|
||||
aria-hidden="false"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div class="van-tab__pane">
|
||||
@ -597,11 +500,8 @@ exports[`swipe switch tab after swiping tab content 3`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-swipe-item van-tab__pane-wrapper van-tab__pane-wrapper--inactive"
|
||||
id="van-tab"
|
||||
role="tabpanel"
|
||||
tabindex="-1"
|
||||
aria-hidden="true"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div class="van-tab__pane">
|
||||
|
||||
@ -7,34 +7,28 @@ exports[`should render Tab inside a component correctly 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
2
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
1
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
3
|
||||
@ -47,28 +41,19 @@ exports[`should render Tab inside a component correctly 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style
|
||||
>
|
||||
1
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
@ -83,34 +68,28 @@ exports[`should render correctly after inserting a tab 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
1
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
2
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-2"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
3
|
||||
@ -123,29 +102,20 @@ exports[`should render correctly after inserting a tab 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="display: none;"
|
||||
>
|
||||
</div>
|
||||
<div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-1"
|
||||
>
|
||||
2
|
||||
</div>
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-2"
|
||||
style="display: none;"
|
||||
>
|
||||
3
|
||||
@ -161,23 +131,19 @@ exports[`should render correctly after inserting a tab with name 1`] = `
|
||||
class="van-tabs__nav van-tabs__nav--line"
|
||||
aria-orientation="horizontal"
|
||||
>
|
||||
<div id="van-tabs-0"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab"
|
||||
tabindex="-1"
|
||||
aria-selected="false"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
bar
|
||||
</span>
|
||||
</div>
|
||||
<div id="van-tabs-1"
|
||||
role="tab"
|
||||
<div role="tab"
|
||||
class="van-tab van-tab--active"
|
||||
tabindex="0"
|
||||
aria-selected="true"
|
||||
aria-controls="van-tab"
|
||||
>
|
||||
<span class="van-tab__text van-tab__text--ellipsis">
|
||||
foo
|
||||
@ -190,20 +156,14 @@ exports[`should render correctly after inserting a tab with name 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-tabs__content">
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="-1"
|
||||
aria-labelledby="van-tabs-0"
|
||||
style="display: none;"
|
||||
>
|
||||
bar
|
||||
</div>
|
||||
<div id="van-tab"
|
||||
role="tabpanel"
|
||||
<div role="tabpanel"
|
||||
class="van-tab__pane"
|
||||
tabindex="0"
|
||||
aria-labelledby="van-tabs-1"
|
||||
style
|
||||
>
|
||||
foo
|
||||
|
||||
@ -44,7 +44,6 @@ import {
|
||||
useEventListener,
|
||||
onMountedOrActivated,
|
||||
} from '@vant/use';
|
||||
import { useId } from '../composables/use-id';
|
||||
import { route, RouteProps } from '../composables/use-route';
|
||||
import { useRefs } from '../composables/use-refs';
|
||||
import { useExpose } from '../composables/use-expose';
|
||||
@ -124,7 +123,6 @@ export default defineComponent({
|
||||
const navRef = ref<HTMLElement>();
|
||||
const wrapRef = ref<HTMLElement>();
|
||||
|
||||
const id = useId();
|
||||
const scroller = useScrollParent(root);
|
||||
const [titleRefs, setTitleRefs] = useRefs<ComponentInstance>();
|
||||
const { children, linkChildren } = useChildren(TABS_KEY);
|
||||
@ -361,14 +359,12 @@ export default defineComponent({
|
||||
const renderNav = () =>
|
||||
children.map((item, index) => (
|
||||
<TabsTitle
|
||||
id={`${id}-${index}`}
|
||||
ref={setTitleRefs(index)}
|
||||
type={props.type}
|
||||
color={props.color}
|
||||
style={item.titleStyle}
|
||||
class={item.titleClass}
|
||||
isActive={index === state.currentIndex}
|
||||
controls={item.id}
|
||||
scrollable={scrollable.value}
|
||||
renderTitle={item.$slots.title}
|
||||
activeColor={props.titleActiveColor}
|
||||
@ -476,7 +472,6 @@ export default defineComponent({
|
||||
useEventListener('scroll', onScroll, { target: scroller });
|
||||
|
||||
linkChildren({
|
||||
id,
|
||||
props,
|
||||
setLine,
|
||||
onRendered,
|
||||
|
||||
@ -8,7 +8,6 @@ export default defineComponent({
|
||||
name,
|
||||
|
||||
props: {
|
||||
id: String,
|
||||
dot: Boolean,
|
||||
type: String,
|
||||
color: String,
|
||||
@ -16,7 +15,6 @@ export default defineComponent({
|
||||
badge: numericProp,
|
||||
isActive: Boolean,
|
||||
disabled: Boolean,
|
||||
controls: String,
|
||||
scrollable: Boolean,
|
||||
activeColor: String,
|
||||
renderTitle: Function,
|
||||
@ -77,7 +75,6 @@ export default defineComponent({
|
||||
|
||||
return () => (
|
||||
<div
|
||||
id={props.id}
|
||||
role="tab"
|
||||
class={[
|
||||
bem({
|
||||
@ -89,7 +86,6 @@ export default defineComponent({
|
||||
tabindex={props.disabled ? undefined : props.isActive ? 0 : -1}
|
||||
aria-selected={props.isActive}
|
||||
aria-disabled={props.disabled || undefined}
|
||||
aria-controls={props.controls}
|
||||
>
|
||||
{renderText()}
|
||||
</div>
|
||||
|
||||
@ -11,7 +11,6 @@ export type TabsClickTabEventParams = {
|
||||
};
|
||||
|
||||
export type TabsProvide = {
|
||||
id: string;
|
||||
props: TabsProps;
|
||||
setLine: () => void;
|
||||
onRendered: (name: string | number, title?: string) => void;
|
||||
|
||||
1
packages/vant/src/vue-tsx-shim.d.ts
vendored
1
packages/vant/src/vue-tsx-shim.d.ts
vendored
@ -4,7 +4,6 @@ type EventHandler = (...args: any[]) => void;
|
||||
|
||||
declare module 'vue' {
|
||||
interface ComponentCustomProps {
|
||||
id?: string;
|
||||
role?: string;
|
||||
tabindex?: number;
|
||||
onClick?: EventHandler;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user