mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
feat(TextEllipsis): add TextEllipsis component (#11593)
* chore: add menu * feat(Ellipsis): add Ellipsis component * style: improve style * chore: improve resize observer * chore: improve code * chore: rename to text-ellipsis
This commit is contained in:
Gavin
GitHub
parent
9f17342936
commit
0661f1f1fa
114
packages/vant/src/text-ellipsis/README.md
Normal file
114
packages/vant/src/text-ellipsis/README.md
Normal file
@ -0,0 +1,114 @@
|
||||
# TextEllipsis
|
||||
|
||||
### Intro
|
||||
|
||||
Show ellipsis for long text and support for Expand/Collapse.
|
||||
|
||||
### Install
|
||||
|
||||
Register component globally via `app.use`, refer to [Component Registration](#/en-US/advanced-usage#zu-jian-zhu-ce) for more registration ways.
|
||||
|
||||
```js
|
||||
import { createApp } from 'vue';
|
||||
import { TextEllipsis } from 'vant';
|
||||
|
||||
const app = createApp();
|
||||
app.use(TextEllipsis);
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
### Basic Usage
|
||||
|
||||
Show one rows by default.
|
||||
|
||||
```html
|
||||
<van-text-ellipsis :content="text" />
|
||||
```
|
||||
|
||||
```js
|
||||
export default {
|
||||
setup() {
|
||||
const text =
|
||||
'Vant is a lightweight, customizable mobile component library that was open sourced in 2017. Currently Vant officially provides Vue 2 version, Vue 3 version and WeChat applet version, and the community team maintains React version and Alipay applet version.';
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
### Expand/Collapse
|
||||
|
||||
Support Expand/Collapse.
|
||||
|
||||
```html
|
||||
<van-text-ellipsis
|
||||
:content="text"
|
||||
expand-text="expand"
|
||||
collapse-text="collapse"
|
||||
/>
|
||||
```
|
||||
|
||||
```js
|
||||
export default {
|
||||
setup() {
|
||||
const text =
|
||||
'Vant is a lightweight, customizable mobile component library that was open sourced in 2017. Currently Vant officially provides Vue 2 version, Vue 3 version and WeChat applet version, and the community team maintains React version and Alipay applet version.';
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
### Customize rows
|
||||
|
||||
Display the number of `rows` by setting rows.
|
||||
|
||||
```html
|
||||
<van-text-ellipsis
|
||||
rows="3"
|
||||
:content="text"
|
||||
expand-text="expand"
|
||||
collapse-text="collapse"
|
||||
/>
|
||||
```
|
||||
|
||||
```js
|
||||
export default {
|
||||
setup() {
|
||||
const text =
|
||||
'Vant is a lightweight, customizable mobile component library that was open sourced in 2017. Currently Vant officially provides Vue 2 version, Vue 3 version and WeChat applet version, and the community team maintains React version and Alipay applet version.';
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
### Props
|
||||
|
||||
| Attribute | Description | Type | Default |
|
||||
| ------------- | ------------------------ | ------------------ | ------- |
|
||||
| rows | Number of rows displayed | _number \| string_ | `1` |
|
||||
| content | The text displayed | _string_ | - |
|
||||
| expand-text | Expand operation text | _string_ | - |
|
||||
| collapse-text | Collapse operation text | _string_ | - |
|
||||
|
||||
### Events
|
||||
|
||||
| Event | Description | Arguments |
|
||||
| ------------ | --------------------------------------- | ------------------- |
|
||||
| click-action | Emitted when Expand/Collapse is clicked | _event: MouseEvent_ |
|
||||
|
||||
### Types
|
||||
|
||||
The component exports the following type definitions:
|
||||
|
||||
```ts
|
||||
import type { TextEllipsisProps, TextEllipsisThemeVars } from 'vant';
|
||||
```
|
||||
|
||||
## Theming
|
||||
|
||||
### CSS Variables
|
||||
|
||||
The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/config-provider).
|
||||
|
||||
| Name | Default Value | Description |
|
||||
| -------------------------------- | ----------------- | ----------- |
|
||||
| --van-text-ellipsis-action-color | _var(--van-blue)_ | - |
|
||||
110
packages/vant/src/text-ellipsis/README.zh-CN.md
Normal file
110
packages/vant/src/text-ellipsis/README.zh-CN.md
Normal file
@ -0,0 +1,110 @@
|
||||
# TextEllipsis 文本省略
|
||||
|
||||
### 介绍
|
||||
|
||||
对长文本进行省略，支持展开/收起。
|
||||
|
||||
### 引入
|
||||
|
||||
通过以下方式来全局注册组件，更多注册方式请参考[组件注册](#/zh-CN/advanced-usage#zu-jian-zhu-ce)。
|
||||
|
||||
```js
|
||||
import { createApp } from 'vue';
|
||||
import { TextEllipsis } from 'vant';
|
||||
|
||||
const app = createApp();
|
||||
app.use(TextEllipsis);
|
||||
```
|
||||
|
||||
## 代码演示
|
||||
|
||||
### 基础用法
|
||||
|
||||
默认展示`1`行，超过`1`行显示省略号。
|
||||
|
||||
```html
|
||||
<van-text-ellipsis :content="text" />
|
||||
```
|
||||
|
||||
```js
|
||||
export default {
|
||||
setup() {
|
||||
const text =
|
||||
'Vant 是一个轻量、可定制的移动端组件库，于 2017 年开源。目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本，并由社区团队维护 React 版本和支付宝小程序版本。';
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
### 展开/收起
|
||||
|
||||
超过行数支持展开/收起。
|
||||
|
||||
```html
|
||||
<van-text-ellipsis :content="text" expand-text="展开" collapse-text="收起" />
|
||||
```
|
||||
|
||||
```js
|
||||
export default {
|
||||
setup() {
|
||||
const text =
|
||||
'Vant 是一个轻量、可定制的移动端组件库，于 2017 年开源。目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本，并由社区团队维护 React 版本和支付宝小程序版本。';
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
### 自定义展示行数
|
||||
|
||||
通过设置 `rows` 限制展示行数。
|
||||
|
||||
```html
|
||||
<van-text-ellipsis
|
||||
rows="3"
|
||||
:content="text"
|
||||
expand-text="展开"
|
||||
collapse-text="收起"
|
||||
/>
|
||||
```
|
||||
|
||||
```js
|
||||
export default {
|
||||
setup() {
|
||||
const text =
|
||||
'Vant 是一个轻量、可定制的移动端组件库，于 2017 年开源。目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本，并由社区团队维护 React 版本和支付宝小程序版本。';
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
### Props
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| ------------- | -------------- | ------------------ | ------ |
|
||||
| rows | 展示的行数 | _number \| string_ | `1` |
|
||||
| content | 需要展示的文本 | _string_ | - |
|
||||
| expand-text | 展开操作的文案 | _string_ | - |
|
||||
| collapse-text | 收起操作的文案 | _string_ | - |
|
||||
|
||||
### Events
|
||||
|
||||
| 事件 | 说明 | 回调参数 |
|
||||
| ------------ | ------------------- | ------------------- |
|
||||
| click-action | 点击展开/收起时触发 | _event: MouseEvent_ |
|
||||
|
||||
### 类型定义
|
||||
|
||||
组件导出以下类型定义：
|
||||
|
||||
```ts
|
||||
import type { TextEllipsisProps, TextEllipsisThemeVars } from 'vant';
|
||||
```
|
||||
|
||||
## 主题定制
|
||||
|
||||
### 样式变量
|
||||
|
||||
组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| -------------------------------- | ----------------- | ---- |
|
||||
| --van-text-ellipsis-action-color | _var(--van-blue)_ | - |
|
||||
138
packages/vant/src/text-ellipsis/TextEllipsis.tsx
Normal file
138
packages/vant/src/text-ellipsis/TextEllipsis.tsx
Normal file
@ -0,0 +1,138 @@
|
||||
import {
|
||||
ref,
|
||||
watch,
|
||||
onMounted,
|
||||
defineComponent,
|
||||
type ExtractPropTypes,
|
||||
} from 'vue';
|
||||
|
||||
// Composables
|
||||
import { useEventListener } from '@vant/use';
|
||||
|
||||
// Utils
|
||||
import { makeNumericProp, makeStringProp, createNamespace } from '../utils';
|
||||
|
||||
const [name, bem] = createNamespace('text-ellipsis');
|
||||
|
||||
export const textEllipsisProps = {
|
||||
rows: makeNumericProp(1),
|
||||
content: makeStringProp(''),
|
||||
expandText: makeStringProp(''),
|
||||
collapseText: makeStringProp(''),
|
||||
};
|
||||
|
||||
export type TextEllipsisProps = ExtractPropTypes<typeof textEllipsisProps>;
|
||||
|
||||
export default defineComponent({
|
||||
name,
|
||||
|
||||
inheritAttrs: false,
|
||||
|
||||
props: textEllipsisProps,
|
||||
|
||||
emits: ['clickAction'],
|
||||
|
||||
setup(props, { emit }) {
|
||||
const text = ref('');
|
||||
const expanded = ref(false);
|
||||
const hasAction = ref(false);
|
||||
const root = ref<HTMLElement>();
|
||||
|
||||
const pxToNum = (value: string | null) => {
|
||||
if (!value) return 0;
|
||||
const match = value.match(/^\d*(\.\d*)?/);
|
||||
return match ? Number(match[0]) : 0;
|
||||
};
|
||||
|
||||
const calcEllipsised = () => {
|
||||
const cloneContainer = () => {
|
||||
if (!root.value) return;
|
||||
|
||||
const originStyle = window.getComputedStyle(root.value);
|
||||
const container = document.createElement('div');
|
||||
const styleNames: string[] = Array.prototype.slice.apply(originStyle);
|
||||
styleNames.forEach((name) => {
|
||||
container.style.setProperty(name, originStyle.getPropertyValue(name));
|
||||
});
|
||||
|
||||
container.style.position = 'fixed';
|
||||
container.style.zIndex = '-9999';
|
||||
container.style.top = '-9999px';
|
||||
container.style.height = 'auto';
|
||||
container.style.minHeight = 'auto';
|
||||
container.style.maxHeight = 'auto';
|
||||
|
||||
container.innerText = props.content;
|
||||
document.body.appendChild(container);
|
||||
return container;
|
||||
};
|
||||
|
||||
const calcEllipsisText = (
|
||||
container: HTMLDivElement,
|
||||
maxHeight: number
|
||||
) => {
|
||||
const { content, expandText } = props;
|
||||
const dot = '...';
|
||||
let left = 0;
|
||||
let right = content.length;
|
||||
let res = -1;
|
||||
|
||||
while (left <= right) {
|
||||
const mid = Math.floor((left + right) / 2);
|
||||
container.innerText = content.slice(0, mid) + dot + expandText;
|
||||
if (container.offsetHeight <= maxHeight) {
|
||||
left = mid + 1;
|
||||
res = mid;
|
||||
} else {
|
||||
right = mid - 1;
|
||||
}
|
||||
}
|
||||
return content.slice(0, res) + dot;
|
||||
};
|
||||
|
||||
const container = cloneContainer();
|
||||
if (!container) return;
|
||||
|
||||
const { paddingBottom, paddingTop, lineHeight } = container.style;
|
||||
const maxHeight =
|
||||
(Number(props.rows) + 0.5) * pxToNum(lineHeight) +
|
||||
pxToNum(paddingTop) +
|
||||
pxToNum(paddingBottom);
|
||||
if (maxHeight < container.offsetHeight) {
|
||||
hasAction.value = true;
|
||||
text.value = calcEllipsisText(container, maxHeight);
|
||||
} else {
|
||||
hasAction.value = false;
|
||||
text.value = props.content;
|
||||
}
|
||||
|
||||
document.body.removeChild(container);
|
||||
};
|
||||
|
||||
const onClickAction = (event: MouseEvent) => {
|
||||
expanded.value = !expanded.value;
|
||||
emit('clickAction', event);
|
||||
};
|
||||
|
||||
const renderAction = () => (
|
||||
<span class={bem('action')} onClick={onClickAction}>
|
||||
{expanded.value ? props.collapseText : props.expandText}
|
||||
</span>
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
calcEllipsised();
|
||||
});
|
||||
|
||||
watch(() => [props.content, props.rows], calcEllipsised);
|
||||
|
||||
useEventListener('resize', calcEllipsised);
|
||||
|
||||
return () => (
|
||||
<div ref={root} class={bem()}>
|
||||
{expanded.value ? props.content : text.value}
|
||||
{hasAction.value ? renderAction() : null}
|
||||
</div>
|
||||
);
|
||||
},
|
||||
});
|
||||
55
packages/vant/src/text-ellipsis/demo/index.vue
Normal file
55
packages/vant/src/text-ellipsis/demo/index.vue
Normal file
@ -0,0 +1,55 @@
|
||||
<script setup lang="ts">
|
||||
import VanTextEllipsis from '..';
|
||||
import { useTranslate } from '../../../docs/site';
|
||||
|
||||
const textCN =
|
||||
'Vant 是一个轻量、可定制的移动端组件库，于2017年开源。目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本，并由社区团队维护 React 版本和支付宝小程序版本。';
|
||||
const textUS =
|
||||
'Vant is a lightweight, customizable mobile component library that was open sourced in 2017. Currently Vant officially provides Vue 2 version, Vue 3 version and WeChat applet version, and the community team maintains React version and Alipay applet version.';
|
||||
|
||||
const t = useTranslate({
|
||||
'zh-CN': {
|
||||
text: textCN,
|
||||
expandText: '展开',
|
||||
collapseText: '收起',
|
||||
expandCollapse: '展开/收起',
|
||||
customRows: '自定义展示行数',
|
||||
},
|
||||
'en-US': {
|
||||
text: textUS,
|
||||
expandText: 'expand',
|
||||
collapseText: 'collapse',
|
||||
expandCollapse: 'Expand/Collapse',
|
||||
customRows: 'Customize Rows',
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<demo-block :title="t('basicUsage')">
|
||||
<van-text-ellipsis :content="t('text')" />
|
||||
</demo-block>
|
||||
|
||||
<demo-block :title="t('expandCollapse')">
|
||||
<van-text-ellipsis
|
||||
:content="t('text')"
|
||||
:expand-text="t('expandText')"
|
||||
:collapse-text="t('collapseText')"
|
||||
/>
|
||||
</demo-block>
|
||||
|
||||
<demo-block :title="t('customRows')">
|
||||
<van-text-ellipsis
|
||||
rows="3"
|
||||
:content="t('text')"
|
||||
:expand-text="t('expandText')"
|
||||
:collapse-text="t('collapseText')"
|
||||
/>
|
||||
</demo-block>
|
||||
</template>
|
||||
|
||||
<style lang="less">
|
||||
.van-text-ellipsis {
|
||||
padding: 0 20px;
|
||||
}
|
||||
</style>
|
||||
17
packages/vant/src/text-ellipsis/index.less
Normal file
17
packages/vant/src/text-ellipsis/index.less
Normal file
@ -0,0 +1,17 @@
|
||||
:root {
|
||||
--van-text-ellipsis-action-color: var(--van-blue);
|
||||
}
|
||||
|
||||
.van-text-ellipsis {
|
||||
line-height: 1.5;
|
||||
white-space: pre-wrap;
|
||||
|
||||
&__action {
|
||||
cursor: pointer;
|
||||
color: var(--van-text-ellipsis-action-color);
|
||||
|
||||
&:active {
|
||||
opacity: var(--van-active-opacity);
|
||||
}
|
||||
}
|
||||
}
|
||||
15
packages/vant/src/text-ellipsis/index.ts
Normal file
15
packages/vant/src/text-ellipsis/index.ts
Normal file
@ -0,0 +1,15 @@
|
||||
import { withInstall } from '../utils';
|
||||
import _TextEllipsis from './TextEllipsis';
|
||||
|
||||
export const TextEllipsis = withInstall(_TextEllipsis);
|
||||
export default TextEllipsis;
|
||||
export { textEllipsisProps } from './TextEllipsis';
|
||||
|
||||
export type { TextEllipsisProps } from './TextEllipsis';
|
||||
export type { TextEllipsisThemeVars } from './types';
|
||||
|
||||
declare module 'vue' {
|
||||
export interface GlobalComponents {
|
||||
VanTextEllipsis: typeof TextEllipsis;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,27 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`should render demo and match snapshot 1`] = `
|
||||
<div>
|
||||
<div class="van-text-ellipsis">
|
||||
Vant is a lightweight, customizable mobile component library that was open sourced in 2017. Currently Vant officially provides Vue 2 version, Vue 3 version and WeChat applet version, and the community team maintains React version and Alipay applet version...
|
||||
<span class="van-text-ellipsis__action">
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-text-ellipsis">
|
||||
Vant is a lightweight, customizable mobile component library that was open sourced in 2017. Currently Vant officially provides Vue 2 version, Vue 3 version and WeChat applet version, and the community team maintains React version and Alipay applet version...
|
||||
<span class="van-text-ellipsis__action">
|
||||
expand
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-text-ellipsis">
|
||||
Vant is a lightweight, customizable mobile component library that was open sourced in 2017. Currently Vant officially provides Vue 2 version, Vue 3 version and WeChat applet version, and the community team maintains React version and Alipay applet version...
|
||||
<span class="van-text-ellipsis__action">
|
||||
expand
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
@ -0,0 +1,9 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`should render content correctly 1`] = `
|
||||
<div class="van-text-ellipsis">
|
||||
Vant is a lightweight, customizable mobile component library th...
|
||||
<span class="van-text-ellipsis__action">
|
||||
</span>
|
||||
</div>
|
||||
`;
|
||||
4
packages/vant/src/text-ellipsis/test/demo.spec.ts
Normal file
4
packages/vant/src/text-ellipsis/test/demo.spec.ts
Normal file
@ -0,0 +1,4 @@
|
||||
import Demo from '../demo/index.vue';
|
||||
import { snapshotDemo } from '../../../test/demo';
|
||||
|
||||
snapshotDemo(Demo);
|
||||
91
packages/vant/src/text-ellipsis/test/index.spec.ts
Normal file
91
packages/vant/src/text-ellipsis/test/index.spec.ts
Normal file
@ -0,0 +1,91 @@
|
||||
import { mount } from '../../../test';
|
||||
import { nextTick } from 'vue';
|
||||
import TextEllipsis from '..';
|
||||
|
||||
const originGetComputedStyle = window.getComputedStyle;
|
||||
|
||||
const lineHeight = 20;
|
||||
|
||||
const content =
|
||||
'Vant is a lightweight, customizable mobile component library that was open sourced in 2017. Currently Vant officially provides Vue 2 version, Vue 3 version and WeChat applet version, and the community team maintains React version and Alipay applet version.';
|
||||
|
||||
beforeAll(() => {
|
||||
window.getComputedStyle = (el) => {
|
||||
const style = originGetComputedStyle(el);
|
||||
style.lineHeight = `${lineHeight}px`;
|
||||
return style;
|
||||
};
|
||||
Object.defineProperty(HTMLElement.prototype, 'offsetHeight', {
|
||||
get() {
|
||||
if (this.innerText.includes('...')) {
|
||||
const row = Math.ceil(
|
||||
(this.innerText.replace(/\.\.\./g, '中').length / content.length) * 4
|
||||
);
|
||||
return lineHeight * row;
|
||||
}
|
||||
return lineHeight * 4;
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
afterAll(() => {
|
||||
window.getComputedStyle = originGetComputedStyle;
|
||||
});
|
||||
|
||||
test('should render content correctly', async () => {
|
||||
const wrapper = mount(TextEllipsis, {
|
||||
props: {
|
||||
content,
|
||||
},
|
||||
});
|
||||
|
||||
await nextTick();
|
||||
expect(wrapper.html()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('Expand and Collapse should be work', async () => {
|
||||
const wrapper = mount(TextEllipsis, {
|
||||
props: {
|
||||
content,
|
||||
expandText: 'expand',
|
||||
collapseText: 'collapse',
|
||||
},
|
||||
});
|
||||
|
||||
await nextTick();
|
||||
expect(wrapper.text()).toMatch('...');
|
||||
await wrapper.find('.van-text-ellipsis__action').trigger('click');
|
||||
expect(wrapper.text()).not.toMatch('...');
|
||||
});
|
||||
|
||||
test('should emit click event after Expand/Collapse is clicked', async () => {
|
||||
const wrapper = mount(TextEllipsis, {
|
||||
props: {
|
||||
content,
|
||||
expandText: 'expand',
|
||||
collapseText: 'collapse',
|
||||
},
|
||||
});
|
||||
|
||||
await nextTick();
|
||||
await wrapper.find('.van-text-ellipsis__action').trigger('click');
|
||||
expect(wrapper.emitted('click')).toHaveLength(1);
|
||||
});
|
||||
|
||||
test('text not exceeded', async () => {
|
||||
Object.defineProperty(HTMLElement.prototype, 'offsetHeight', {
|
||||
value: lineHeight,
|
||||
});
|
||||
|
||||
const shortContent = 'Vant is a component library';
|
||||
const wrapper = mount(TextEllipsis, {
|
||||
props: {
|
||||
content: shortContent,
|
||||
expandText: 'expand',
|
||||
collapseText: 'collapse',
|
||||
},
|
||||
});
|
||||
|
||||
await nextTick();
|
||||
expect(wrapper.text()).not.toMatch('...');
|
||||
});
|
||||
3
packages/vant/src/text-ellipsis/types.ts
Normal file
3
packages/vant/src/text-ellipsis/types.ts
Normal file
@ -0,0 +1,3 @@
|
||||
export type TextEllipsisThemeVars = {
|
||||
textEllipsisActionColor?: string;
|
||||
};
|
||||
@ -340,6 +340,10 @@ location.href = location.href.replace('youzan.github.io', 'vant-ui.github.io');
|
||||
path: 'tag',
|
||||
title: 'Tag 标签',
|
||||
},
|
||||
{
|
||||
path: 'text-ellipsis',
|
||||
title: 'TextEllipsis 文本省略',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
@ -482,7 +486,8 @@ location.href = location.href.replace('youzan.github.io', 'vant-ui.github.io');
|
||||
'en-US': {
|
||||
title: 'Vant 4',
|
||||
subtitle: ' (for Vue 3)',
|
||||
description: 'A lightweight, customizable Vue UI library for mobile web apps.',
|
||||
description:
|
||||
'A lightweight, customizable Vue UI library for mobile web apps.',
|
||||
logo: 'https://fastly.jsdelivr.net/npm/@vant/assets/logo.png',
|
||||
langLabel: 'EN',
|
||||
links: [
|
||||
@ -775,6 +780,10 @@ location.href = location.href.replace('youzan.github.io', 'vant-ui.github.io');
|
||||
path: 'tag',
|
||||
title: 'Tag',
|
||||
},
|
||||
{
|
||||
path: 'text-ellipsis',
|
||||
title: 'TextEllipsis',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user