Skip to content

Commit

Permalink
fix(ui:anchor): use getElementById
Browse files Browse the repository at this point in the history
  • Loading branch information
@xiejay97
xiejay97 committed Aug 16, 2022
1 parent 2b98c82 commit 7bd740b
Show file tree
Hide file tree
Showing 9 changed files with 23 additions and 38 deletions.
2 changes: 1 addition & 1 deletion .stylelintignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,4 @@
/coverage
/.yarn
/packages/site/dist
/packages/site/src/app/routes
/packages/site/src/app/routes
8 changes: 4 additions & 4 deletions packages/site/src/app/components/route/RouteArticle.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,8 @@ export function AppRouteArticle(props: AppRouteArticleProps) {
const { i18n } = useTranslation();
const mediaMatch = useMediaMatch();

const [_links, setLinks] = useImmer<{ title: string; href: string }[]>([]);
const links = isUndefined(props.links) ? _links : [...props.links, { title: 'API', href: '#API' }];
const [_links, setLinks] = useImmer<{ title?: string; href: string }[]>([]);
const links = isUndefined(props.links) ? _links : [...props.links, { href: 'API' }];

const [menuOpen, setMenuOpen] = useState(false);

Expand Down Expand Up @@ -58,9 +58,9 @@ m -673.67664,1221.6502 -231.2455,-231.24803 55.6165,

useLayoutEffect(() => {
if (isUndefined(props.links)) {
const arr: { title: string; href: string }[] = [];
const arr: { href: string }[] = [];
document.querySelectorAll('.app-route-article h2').forEach((el) => {
arr.push({ title: el.id, href: `#${el.id}` });
arr.push({ href: el.id });
});
setLinks(arr);
}
Expand Down
2 changes: 1 addition & 1 deletion packages/site/src/app/routes/docs/Internationalization/Internationalization.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ export default function App() {
}
```

## add language
## Add language

Support for adding languages:

Expand Down
12 changes: 6 additions & 6 deletions packages/ui/components/anchor/Anchor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@ import { usePrefixConfig, useComponentConfig, useLayout } from '../../hooks';
import { registerComponentMate } from '../../utils';

export interface DAnchorItem {
title: React.ReactNode;
href: string;
title?: React.ReactNode;
target?: string;
}

Expand Down Expand Up @@ -76,7 +76,7 @@ function Anchor<T extends DAnchorItem>(props: DAnchorProps<T>, ref: React.Forwar
let nearestEl: [string, number] | undefined;
const reduceLinks = (arr: DNestedChildren<T>[]) => {
arr.forEach(({ href, children }) => {
const el = document.querySelector(href);
const el = document.getElementById(href);
if (el) {
const top = el.getBoundingClientRect().top;
// Add 1 because `getBoundingClientRect` return decimal
Expand Down Expand Up @@ -165,10 +165,10 @@ function Anchor<T extends DAnchorItem>(props: DAnchorProps<T>, ref: React.Forwar
const pageTop = pageEl.getBoundingClientRect().top;

const scrollTop = pageEl.scrollTop;
window.location.hash = href;
window.location.hash = `#${href}`;
pageEl.scrollTop = scrollTop;

const el = document.querySelector(href);
const el = document.getElementById(href);
if (el) {
const top = el.getBoundingClientRect().top;
const scrollTop = top - pageTop + pageEl.scrollTop - dDistance;
Expand All @@ -192,7 +192,7 @@ function Anchor<T extends DAnchorItem>(props: DAnchorProps<T>, ref: React.Forwar
'is-active': linkHref === activeHref,
})}
style={{ paddingLeft: 16 + level * 16 }}
href={linkHref}
href={`#${linkHref}`}
target={linkTarget}
onClick={(e) => {
e.preventDefault();
Expand All @@ -201,7 +201,7 @@ function Anchor<T extends DAnchorItem>(props: DAnchorProps<T>, ref: React.Forwar
handleLinkClick(linkHref);
}}
>
{linkTitle}
{linkTitle ?? linkHref}
</a>
</li>
{children && getNodes(children, level + 1)}
Expand Down
11 changes: 3 additions & 8 deletions packages/ui/components/anchor/demos/1.Basic.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,15 +21,10 @@ export default function Demo() {
<DAnchor
dList={[
{
title: 'Examples',
href: '#Examples',
children: [
{ title: 'AnchorBasicDemo', href: '#AnchorBasicDemo' },
{ title: 'AnchorIndicatorDemo', href: '#AnchorIndicatorDemo' },
{ title: 'AnchorScrollDemo', href: '#AnchorScrollDemo' },
],
href: 'Examples',
children: [{ href: 'AnchorBasicDemo' }, { href: 'AnchorIndicatorDemo' }, { href: 'AnchorScrollDemo' }],
},
{ title: 'API', href: '#API' },
{ href: 'API' },
]}
/>
</DAffix>
Expand Down
11 changes: 3 additions & 8 deletions packages/ui/components/anchor/demos/2.Indicator.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,15 +24,10 @@ export default function Demo() {
<DAnchor
dList={[
{
title: 'Examples',
href: '#Examples',
children: [
{ title: 'AnchorBasicDemo', href: '#AnchorBasicDemo' },
{ title: 'AnchorIndicatorDemo', href: '#AnchorIndicatorDemo' },
{ title: 'AnchorScrollDemo', href: '#AnchorScrollDemo' },
],
href: 'Examples',
children: [{ href: 'AnchorBasicDemo' }, { href: 'AnchorIndicatorDemo' }, { href: 'AnchorScrollDemo' }],
},
{ title: 'API', href: '#API' },
{ href: 'API' },
]}
dIndicator={DAnchor.LINE_INDICATOR}
/>
Expand Down
11 changes: 3 additions & 8 deletions packages/ui/components/anchor/demos/3.Scroll.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,15 +20,10 @@ export default function Demo() {
<DAnchor
dList={[
{
title: 'Examples',
href: '#Examples',
children: [
{ title: 'AnchorBasicDemo', href: '#AnchorBasicDemo' },
{ title: 'AnchorIndicatorDemo', href: '#AnchorIndicatorDemo' },
{ title: 'AnchorScrollDemo', href: '#AnchorScrollDemo' },
],
href: 'Examples',
children: [{ href: 'AnchorBasicDemo' }, { href: 'AnchorIndicatorDemo' }, { href: 'AnchorScrollDemo' }],
},
{ title: 'API', href: '#API' },
{ href: 'API' },
]}
dDistance={window.innerHeight / 2}
dScrollBehavior="smooth"
Expand Down
2 changes: 1 addition & 1 deletion tools/executors/site/build-base/impl.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -246,7 +246,7 @@ class GenerateSite {
demoStr = demoStr.replace(/__tsxSource__/g, new TextEncoder().encode(demo.get(lang).tsx.match(/(?<=```tsx\n)[\s\S]*?(?=```)/g)[0]).join());
demoStr = demoStr.replace(/__scssSource__/g, demo.get(lang).scss ? new TextEncoder().encode(demo.get(lang).scss.match(/(?<=```scss\n)[\s\S]*?(?=```)/g)[0]).join() : '');
demosStr += demoStr;
linksStr += String.raw `{ title: '${demo.get(lang).title}', href: '#${demo.get(lang).id}' }, `;
linksStr += String.raw `{ title: '${demo.get(lang).title}', href: '${demo.get(lang).id}' }, `;
}
});
let routeArticleProps = String.raw `
Expand Down
2 changes: 1 addition & 1 deletion tools/executors/site/build-base/impl.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -261,7 +261,7 @@ class GenerateSite {

demosStr += demoStr;

linksStr += String.raw`{ title: '${demo.get(lang)!.title!}', href: '#${demo.get(lang)!.id!}' }, `;
linksStr += String.raw`{ title: '${demo.get(lang)!.title!}', href: '${demo.get(lang)!.id!}' }, `;
}
});

Expand Down

0 comments on commit 7bd740b

Please # to comment.