+
+
+
+ document}
+ />
+ TOP}
+ container={() => document}
+ />
+ UP}
+ container={() => document}
+ />
+
+
+
+
+ )
+ }
+}
diff --git a/tdesign/desktop/src/back-top/_example/back-top-shape.tsx b/tdesign/desktop/src/back-top/_example/back-top-shape.tsx
new file mode 100644
index 0000000000..f54ad50bba
--- /dev/null
+++ b/tdesign/desktop/src/back-top/_example/back-top-shape.tsx
@@ -0,0 +1,97 @@
+import { OmiProps, WeElement, h, tag, classNames, render, createRef } from 'omi'
+
+import '../index'
+
+import '../../space'
+
+@tag('back-top-shape')
+export default class backTopShape extends WeElement {
+ height = 300
+
+ // scrollCss =
+ // `.t-list{
+ // height: ` +
+ // this.height +
+ // `px !important;
+ // overflow: auto,
+ // }`
+
+ // sizeStyle = {
+ // position: 'relative',
+ // insetInlineEnd: 0,
+ // insetBlockEnd: 0,
+ // }
+
+ withStyle = `
+ .t-back-top{
+ position: relative !important;
+ right: 0 !important;
+ bottom: 0 !important;
+ }
+ `
+ render() {
+ return (
+
+
+
+
+ document}
+ />
+ document}
+ />
+
+
+ document}
+ />
+ document}
+ />
+
+
+ document}
+ />
+ document}
+ />
+
+
+
+
+ )
+ }
+}
diff --git a/tdesign/desktop/src/back-top/_example/back-top-size.tsx b/tdesign/desktop/src/back-top/_example/back-top-size.tsx
index be4d650f74..0a56b8d6fd 100644
--- a/tdesign/desktop/src/back-top/_example/back-top-size.tsx
+++ b/tdesign/desktop/src/back-top/_example/back-top-size.tsx
@@ -32,7 +32,7 @@ export default class backTopSize extends WeElement {
render() {
return (
-
+
+
+
+
+ document}
+ />
+ document}
+ />
+ document}
+ />
+
+
+ document}
+ />
+ document}
+ />
+ document}
+ />
+
+
+ document}
+ />
+ document}
+ />
+ document}
+ />
+
+
+ document}
+ />
+ document}
+ />
+ document}
+ />
+
+
+
+
+ )
+ }
+}
diff --git a/tdesign/desktop/src/back-top/backTop-us.md b/tdesign/desktop/src/back-top/back-top-us.md
similarity index 100%
rename from tdesign/desktop/src/back-top/backTop-us.md
rename to tdesign/desktop/src/back-top/back-top-us.md
diff --git a/tdesign/desktop/src/back-top/backTop.md b/tdesign/desktop/src/back-top/back-top.md
similarity index 100%
rename from tdesign/desktop/src/back-top/backTop.md
rename to tdesign/desktop/src/back-top/back-top.md
diff --git a/tdesign/desktop/src/back-top/backtop.tsx b/tdesign/desktop/src/back-top/backtop.tsx
new file mode 100644
index 0000000000..a02173b2a8
--- /dev/null
+++ b/tdesign/desktop/src/back-top/backtop.tsx
@@ -0,0 +1,53 @@
+import { h, tag, WeElement, OmiProps, classNames } from 'omi'
+import { IconProps } from './type'
+import { TdClassNamePrefix } from '../utils/clsx'
+import css from './style/index'
+
+@tag('t-icon-backtop')
+export default class Backtop extends WeElement {
+ static css = css as string
+
+ static defaultProps = {
+ size: '1em',
+ style: { fill: '#000' },
+ }
+
+ static propTypes = {
+ size: [String, Number],
+ onClick: Function,
+ style: Object,
+ class: String,
+ }
+
+ static isLightDom = true
+
+ render(props: OmiProps) {
+ const classPrefix = 't'
+ const iconClassName = classNames(TdClassNamePrefix('icon'), props.class, {
+ [`${TdClassNamePrefix('size-s')}`]: props.size === 'small',
+ [`${TdClassNamePrefix('size-m')}`]: props.size === 'medium',
+ [`${TdClassNamePrefix('size-l')}`]: props.size === 'large',
+ })
+ const flag = props.size === 'small' || props.size === 'medium' || props.size === 'large'
+ const iconStyle = {
+ ...props.style,
+ fontSize: props.size,
+ }
+ return (
+
+ )
+ }
+}
diff --git a/tdesign/desktop/src/back-top/index.tsx b/tdesign/desktop/src/back-top/index.tsx
index 67b6ec8c24..5dc25d54bb 100644
--- a/tdesign/desktop/src/back-top/index.tsx
+++ b/tdesign/desktop/src/back-top/index.tsx
@@ -5,7 +5,7 @@ import { scrollTo } from '../utils/dom'
import { BackTopProps, UseScrollProps } from './types'
import { TdClassNamePrefix } from '../utils/clsx'
-import '../icon/backtop'
+import './backtop'
const BackTopClassNamePrefix = (className: string) => TdClassNamePrefix('back-top__') + className
@@ -104,7 +104,17 @@ export default class BackTop extends WeElement {
};
-
+ defaultContent = (
+ <>
+
+ TOP
+
+ );
+
+
+ renderChildren(content : any,cusContent :any){
+ return (content || cusContent || this.defaultContent)
+ }
getBackTo = () => {
// if (!this.props.container) return 0
@@ -123,8 +133,8 @@ export default class BackTop extends WeElement {
// scrollTop = useScroll({ target: this.scrollContainer })
installed() {
+
this.scrollContainer = this.getContainer(this.props.container)
- // console.log(this.scrollContainer)
let that = this
// console.log(document.querySelector(this.props.container));
// console.log(this.getContainer(this.props.container))
@@ -166,8 +176,6 @@ export default class BackTop extends WeElement {
} else {
offsetTop = Math.abs((scrollContainer as HTMLElement).scrollTop)
}
- console.log(visibleHeight,'v')
- console.log(offsetTop)
if (offsetTop >= visibleHeight) {
buttonNode.classList.add(TdClassNamePrefix(`back-top--show`)) // 添加类名
} else {
@@ -218,22 +226,22 @@ export default class BackTop extends WeElement {
},
)
}
+
+
//textarea ref
button = createRef()
render(props: OmiProps, store: any) {
- const { container, visibleHeight, offset, size, theme, shape } = props
-
+ const { content } = props
+ const cusContent = props.default
return (
<>
)
From efa322023369dc2e392476d4f677d92af90d82c5 Mon Sep 17 00:00:00 2001
From: Gavi <604983389@qq.com>
Date: Fri, 1 Sep 2023 23:52:30 +0800
Subject: [PATCH 2/2] back-top 1.0.3 and improve back-top in site
---
tdesign/desktop/src/back-top/backtop.tsx | 2 +-
tdesign/desktop/src/back-top/types.ts | 8 ++++++++
2 files changed, 9 insertions(+), 1 deletion(-)
diff --git a/tdesign/desktop/src/back-top/backtop.tsx b/tdesign/desktop/src/back-top/backtop.tsx
index a02173b2a8..35d6b50745 100644
--- a/tdesign/desktop/src/back-top/backtop.tsx
+++ b/tdesign/desktop/src/back-top/backtop.tsx
@@ -1,5 +1,5 @@
import { h, tag, WeElement, OmiProps, classNames } from 'omi'
-import { IconProps } from './type'
+import { IconProps } from './types'
import { TdClassNamePrefix } from '../utils/clsx'
import css from './style/index'
diff --git a/tdesign/desktop/src/back-top/types.ts b/tdesign/desktop/src/back-top/types.ts
index 39388d82f0..6e689ff58e 100644
--- a/tdesign/desktop/src/back-top/types.ts
+++ b/tdesign/desktop/src/back-top/types.ts
@@ -4,6 +4,14 @@ import { TNode, TElement, SizeEnum } from '@src/common';
import { AttachNodeReturnValue } from '../common'
+export interface IconProps {
+ class?: String
+ style?: Object
+ size?: 'small' | 'medium' | 'large' | string | number
+ onClick?: (event: MouseEvent) => void
+}
+
+
export type BackTopProps = {
container?:string | Function