我做了 gatsby-wordpress-starter 的 git 克隆(https://www.gatsbyjs.org/starters/?c=Wordpress)
没有做任何更改,我添加了姿势:(https://popmotion.io/pose/examples/route-transitions-reach-router/)
按照上述 url 中的说明,我将 components/layout.js 文件更改为以下内容(略有不同,因为页面路径没有像示例那样硬编码到布局中):
import React from 'react'
import ReactDOM from 'react-dom';
import { Router, Link, Location } from '@reach/router';
import Helmet from 'react-helmet'
import Navbar from '../components/Navbar'
import Page from '../templates/page'
import './all.sass'
import posed, { PoseGroup } from 'react-pose';
const RouteContainer = posed.div({
enter: { opacity: 1, delay: 300, beforeChildren: 300 },
exit: { opacity: 0 }
});
const PosedRouter = ({ children }) => (
<Location> …Run Code Online (Sandbox Code Playgroud)