使用Inertia从URL获取数据

Question

我正在使用InertiaJs库创建链接，如下所示：

<InertiaLink href={`/item/`+ itemId}>Go to the page</InertiaLink>

点击此链接，链接将如下所示：/item/156654

问题：如何使用Inertia从上面的链接中获得itemId(15665454654654，…(？

我知道React中有一个函数let history = useHistory();，但这种方法对我不起作用。还有什么替代方案？

Answer 1

<InertiaLink />不为打开的页面提供任何上下文，因此需要手动解析URL。在下面的例子中，您可以找到parsePageId()函数，它实际上以最佳方式解析位置路径。

// solution from https://stackoverflow.com/questions/4758103/last-segment-of-url-in-jquery
const parsePageId = (path) => path.substring(path.lastIndexOf('/') + 1)
const Page = () => {
const pageId = parsePageId(window.location.pathname)

// will render "Page id: js", because snippet href is "https://stacksnippets.net/js"
return (
<p>Page id: <b>{pageId}</b></p>
)
}

ReactDOM.render(<Page />, document.querySelector("#root"))

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root" />

Answer 2

您可以使用window.location对象来获得实际的URL，然后应用简单的解析来获得项目id:

const { pathname } = window.location
const splitPathname = pathname.split("/")
const itemId = splitPathname[splitPathname.length - 1]

我们只是将URL的所有部分用"/"并获得最后一个，这将是项目id。