mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
types(IndexBar): add IndexBarInstance type (#9246)
This commit is contained in:
parent
a589fc2d12
commit
713be26ed2
src/index-bar
@ -35,6 +35,9 @@ import {
|
||||
import { useTouch } from '../composables/use-touch';
|
||||
import { useExpose } from '../composables/use-expose';
|
||||
|
||||
// Types
|
||||
import { IndexBarProvide } from './types';
|
||||
|
||||
function genAlphabet() {
|
||||
const charCodeOfA = 'A'.charCodeAt(0);
|
||||
const indexList = Array(26)
|
||||
@ -61,9 +64,7 @@ const props = {
|
||||
},
|
||||
};
|
||||
|
||||
export type IndexBarProvide = {
|
||||
props: ExtractPropTypes<typeof props>;
|
||||
};
|
||||
export type IndexBarProps = ExtractPropTypes<typeof props>;
|
||||
|
||||
export const INDEX_BAR_KEY: InjectionKey<IndexBarProvide> = Symbol(name);
|
||||
|
||||
@ -200,11 +201,8 @@ export default defineComponent({
|
||||
);
|
||||
});
|
||||
|
||||
const scrollTo = (index: string) => {
|
||||
if (!index) {
|
||||
return;
|
||||
}
|
||||
|
||||
const scrollTo = (index: string | number) => {
|
||||
index = String(index);
|
||||
const match = children.find((item) => String(item.index) === index);
|
||||
|
||||
if (match) {
|
||||
|
@ -99,6 +99,19 @@ Use [ref](https://v3.vuejs.org/guide/component-template-refs.html) to get IndexB
|
||||
| --- | --- | --- | --- |
|
||||
| scrollTo | scroll to target element | _index: number \| string_ | - |
|
||||
|
||||
### Types
|
||||
|
||||
Get the type definition of the IndexBar instance through `IndexBarInstance`.
|
||||
|
||||
```ts
|
||||
import { ref } from 'vue';
|
||||
import type { IndexBarInstance } from 'vant';
|
||||
|
||||
const indexBarRef = ref<IndexBarInstance>();
|
||||
|
||||
indexBarRef.value?.scrollTo('B');
|
||||
```
|
||||
|
||||
### IndexAnchor Slots
|
||||
|
||||
| Name | Description |
|
||||
|
@ -103,6 +103,19 @@ export default {
|
||||
| -------- | -------------- | ------------------------- | ------ |
|
||||
| scrollTo | 滚动到指定锚点 | _index: number \| string_ | - |
|
||||
|
||||
### 类型定义
|
||||
|
||||
通过 `IndexBarInstance` 获取 IndexBar 实例的类型定义(从 3.2.0 版本开始支持)。
|
||||
|
||||
```ts
|
||||
import { ref } from 'vue';
|
||||
import type { IndexBarInstance } from 'vant';
|
||||
|
||||
const indexBarRef = ref<IndexBarInstance>();
|
||||
|
||||
indexBarRef.value?.scrollTo('B');
|
||||
```
|
||||
|
||||
### IndexAnchor Slots
|
||||
|
||||
| 名称 | 说明 |
|
||||
|
@ -5,3 +5,4 @@ const IndexBar = withInstall<typeof _IndexBar>(_IndexBar);
|
||||
|
||||
export default IndexBar;
|
||||
export { IndexBar };
|
||||
export type { IndexBarInstance } from './types';
|
||||
|
15
src/index-bar/types.ts
Normal file
15
src/index-bar/types.ts
Normal file
@ -0,0 +1,15 @@
|
||||
import type { ComponentPublicInstance } from 'vue';
|
||||
import type { IndexBarProps } from './IndexBar';
|
||||
|
||||
export type IndexBarProvide = {
|
||||
props: IndexBarProps;
|
||||
};
|
||||
|
||||
export type IndexBarExpose = {
|
||||
scrollTo: (index: string | number) => void;
|
||||
};
|
||||
|
||||
export type IndexBarInstance = ComponentPublicInstance<
|
||||
IndexBarProps,
|
||||
IndexBarExpose
|
||||
>;
|
Loading…
x
Reference in New Issue
Block a user