Skip to content

Commit faba271

Browse files
authored
Merge pull request #11 from 4Catalyzer/customize-scroll-behavior
Allow customizing creation of scroll behavior
2 parents 5023b9d + 56e3cd5 commit faba271

File tree

2 files changed

+30
-2
lines changed

2 files changed

+30
-2
lines changed

README.md

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,28 @@ const shouldUpdateScrollByRoute = (prevRenderArgs, { routes }) => {
6363

6464
return true;
6565
};
66+
67+
const render = renderArgs => (
68+
<ScrollManager
69+
shouldUpdateScroll={shouldUpdateScrollByPathname}
70+
renderArgs={renderArgs}
71+
>
72+
{/* ... */}
73+
</ScrollManager>
74+
);
75+
```
76+
77+
You can customize `<ScrollManager>` even further by providing a `createScrollBehavior` callback that creates the scroll behavior object. This allows using a custom subclass of `ScrollBehavior` from scroll-behavior with custom logic. When using a custom `createScrollBehavior` callback, you can continue to specify the `shouldUpdateScroll` callback as above.
78+
79+
```js
80+
const render = renderArgs => (
81+
<ScrollManager
82+
createScrollBehavior={config => new MyScrollBehavior(config)}
83+
renderArgs={renderArgs}
84+
>
85+
{/* ... */}
86+
</ScrollManager>
87+
);
6688
```
6789

6890
[npm-badge]: https://img.shields.io/npm/v/found-scroll.svg

src/ScrollManager.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,21 +8,26 @@ const STORAGE_NAMESPACE = '@@scroll';
88

99
const propTypes = {
1010
shouldUpdateScroll: PropTypes.func,
11+
createScrollBehavior: PropTypes.func.isRequired,
1112
renderArgs: PropTypes.shape({
1213
location: PropTypes.object.isRequired,
1314
router: routerShape.isRequired,
1415
}).isRequired,
1516
children: PropTypes.element,
1617
};
1718

19+
const defaultProps = {
20+
createScrollBehavior: config => new ScrollBehavior(config),
21+
};
22+
1823
class ScrollManager extends React.Component {
1924
constructor(props, context) {
2025
super(props, context);
2126

22-
const { renderArgs } = props;
27+
const { createScrollBehavior, renderArgs } = props;
2328
const { router } = renderArgs;
2429

25-
this.scrollBehavior = new ScrollBehavior({
30+
this.scrollBehavior = createScrollBehavior({
2631
addTransitionHook: router.addTransitionHook,
2732
stateStorage: new StateStorage(router, STORAGE_NAMESPACE),
2833
getCurrentLocation: () => this.props.renderArgs.location,
@@ -65,5 +70,6 @@ class ScrollManager extends React.Component {
6570
}
6671

6772
ScrollManager.propTypes = propTypes;
73+
ScrollManager.defaultProps = defaultProps;
6874

6975
export default ScrollManager;

0 commit comments

Comments
 (0)