Fixed "scroll to anchor" issues
This commit is contained in:
@@ -48,12 +48,15 @@ class DocumentScene extends React.Component {
|
||||
didScroll: false,
|
||||
}
|
||||
|
||||
componentDidMount = () => {
|
||||
componentDidMount = async () => {
|
||||
const { id } = this.props.routeParams;
|
||||
this.store.fetchDocument(id);
|
||||
await this.store.fetchDocument(id, {
|
||||
replaceUrl: !this.props.location.hash,
|
||||
});
|
||||
this.scrollTohash();
|
||||
}
|
||||
|
||||
componentWillReceiveProps = (nextProps) => {
|
||||
componentWillReceiveProps = async (nextProps) => {
|
||||
const key = nextProps.keydown.event;
|
||||
if (key) {
|
||||
if (key.key === '/' && (key.metaKey || key.ctrl.Key)) {
|
||||
@@ -73,20 +76,13 @@ class DocumentScene extends React.Component {
|
||||
const oldId = this.props.params.id;
|
||||
const newId = nextProps.params.id;
|
||||
if (oldId !== newId) {
|
||||
this.store.fetchDocument(newId, true);
|
||||
await this.store.fetchDocument(newId, {
|
||||
softLoad: true,
|
||||
replaceUrl: !this.props.location.hash,
|
||||
});
|
||||
}
|
||||
|
||||
// Scroll to anchor after loading, and only once
|
||||
const { hash } = this.props.location;
|
||||
|
||||
if (nextProps.doc && hash && !this.state.didScroll) {
|
||||
const name = hash.split('#')[1];
|
||||
setTimeout(() => {
|
||||
this.setState({ didScroll: true });
|
||||
const element = window.document.getElementsByName(name)[0];
|
||||
if (element) element.scrollIntoView();
|
||||
}, 0);
|
||||
}
|
||||
this.scrollTohash();
|
||||
}
|
||||
|
||||
onEdit = () => {
|
||||
@@ -121,6 +117,18 @@ class DocumentScene extends React.Component {
|
||||
a.click();
|
||||
}
|
||||
|
||||
scrollTohash = () => {
|
||||
// Scroll to anchor after loading, and only once
|
||||
const { hash } = this.props.location;
|
||||
|
||||
if (hash && !this.state.didScroll) {
|
||||
const name = hash.slice(1);
|
||||
this.setState({ didScroll: true });
|
||||
const element = window.document.getElementsByName(name)[0];
|
||||
if (element) element.scrollIntoView();
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
sidebar,
|
||||
|
||||
@@ -43,7 +43,12 @@ class DocumentSceneStore {
|
||||
|
||||
/* Actions */
|
||||
|
||||
@action fetchDocument = async (id, softLoad = false) => {
|
||||
@action fetchDocument = async (id, options = {}) => {
|
||||
options = {
|
||||
softLoad: false,
|
||||
replaceUrl: true,
|
||||
...options,
|
||||
};
|
||||
let cacheHit = false;
|
||||
runInAction('retrieve document from cache', () => {
|
||||
const cachedValue = this.cache.fetchFromCache(id);
|
||||
@@ -51,15 +56,15 @@ class DocumentSceneStore {
|
||||
if (cacheHit) this.document = cachedValue;
|
||||
});
|
||||
|
||||
this.isFetching = !softLoad;
|
||||
this.updatingContent = softLoad && !cacheHit;
|
||||
this.isFetching = !options.softLoad;
|
||||
this.updatingContent = options.softLoad && !cacheHit;
|
||||
|
||||
try {
|
||||
const res = await client.get('/documents.info', { id }, { cache: true });
|
||||
const { data } = res;
|
||||
runInAction('fetchDocument', () => {
|
||||
this.document = data;
|
||||
browserHistory.replace(data.url);
|
||||
if (options.replaceUrl) browserHistory.replace(data.url);
|
||||
});
|
||||
} catch (e) {
|
||||
console.error("Something went wrong");
|
||||
|
||||
Reference in New Issue
Block a user