Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including @tsx-react-ui/backtop with all npm packages installed. Try it out:

require("react/package.json"); // react is a peer dependency. require("react-dom/package.json"); // react-dom is a peer dependency. require("core-js/package.json"); // core-js is a peer dependency. require("raf/package.json"); // raf is a peer dependency. var backtop = require("@tsx-react-ui/backtop")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

@tsx-react-ui/backtop v1.0.1

@tsx-react-ui/backtop

  • 作者:maqing01
  • 邮箱:475986855@qq.com

介绍

The backtop component of the react written in Typescript


安装

组件使用 npm 进行管理,请使用以下命令进行组件安装:

npm i @tsx-react-ui/backtop --save
  • 安装cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org

使用

样例文档

  • 待开发

使用

最少配置参数为:

<Backtop />

详细配置:

<Backtop className="custom-back-top" showHeight={300} target={() => document.getElementById('target')} >
    <div className="custom-back-top-icon">UP</div>
</Backtop>

配置参数

PropTypeDefaultDescription
showHeightnumber200当滚动高度超过此值时显示"返回顶部"按钮
classNamestringundefined自定义样式
targetfunction() => window返回指定滚动的DOM元素,默认为window
childrenReactNodeundefined自定义图标

注意事项

  • 组件注意事项

Changelog


RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free