Gatsby 如何基于当前url导入组件？

我想根据我所在的页面导入不同的CSS。HTML将保持不变。我需要做什么才能访问当前位置

我想我可以在构造函数中放入一个

if

语句，然后在那里导入CSS，但我不确定这是否有效

编辑：您不能从

构造函数中导入，因此有没有方法执行条件导入

这是我的密码：

从“React”导入React
从“盖茨比链接”导入链接
类菜单扩展了React.Component{
建造师（道具）{
超级（道具）
//如何获取当前位置？
如果（myCurrentLocation=='/'）{
从“../page assets/global/styles/menu/\u home-page.sass”导入菜单样式
}否则{
从“../page assets/global/styles/menu/\u regular-page.sass”导入菜单样式
}
}
渲染（）{
返回(
工作
我做了
//其他菜单项。。。
)
}
}
导出默认菜单；
是react router dom Link的包装器，因此您应该能够使用
this.props.match.path来访问路由

否则：
您可以使用
window.location.href

在盖茨比v2中，页面组件将能够通过以下方式访问其位置：


对于
class
组件：
this.props.location.pathname
对于功能组件：
props.location.pathname

对于功能组件，确保通过其参数传递
props
。e、 g

const IndexPage = (props) => (
  <Layout>
    <p>This works {props.location.pathname}</p>
  </Layout>
)

这是一个显示上述内容的示例。还有信用卡。
您是在找window.location吗？@StephenCrosby window.location可以，但我认为它可能有一个React属性。这很有用！我将查看是否可以访问
this.props.match.path
我无法访问
render（）
或
constructor（）
函数中的
this.props.match.path
。它应该在该范围内可用吗？在哪里渲染菜单组件？如果它在一个路由组件中，那么你可以把这些道具传给菜单。啊，对了，就是这样。对不起，我的手机生锈了！原来
这个.props.location.pathname
就是票证
this.props.match.path
中似乎只有
/
，而与我所在的页面无关。但我使用的是盖茨比的默认路由器，它使用
页面
目录中的任何页面进行路由，因此它可能不会填充
this.props.match.path
.props.location.pathname，在开发中效果很好，但在生产中，一旦我推到github页面，它就可以在第一次加载时正常工作。服务人员开始工作后，它就不再工作了。但这很奇怪，因为如果我输出值，它会返回它。。。我很困惑。@Joannira我会为这种行为提出诉讼。他们肯定很有帮助，并且会对这种行为感兴趣。
import React from 'react';
import { Location } from '@reach/router';

export default () => (
  <Location>
    {({ navigate, location }) => /* ... */}
  </Location>
);