平凡以上

在客製化區塊中使用 @wordpress/data 找到 site url

2023年10月10日・TungLin・約 1 分鐘閱讀

沒想到有這麼困難... 只是想要動態的找到 site url 而已,花了我整整三小時研究。 在區塊中要使用 wordpress data 可以使用 wp.data,也可以使用 @wordpress/data 官方提供的 npm。 而如果我們要使用資料,並不是使用 {select}...

沒想到有這麼困難... 只是想要動態的找到 site url 而已,花了我整整三小時研究。

在區塊中要使用 wordpress data 可以使用 wp.data,也可以使用 @wordpress/data 官方提供的 npm。

而如果我們要使用資料,並不是使用 {select} 而是要使用 {useSelect}

最終會長這樣:

import { useSelect } from '@wordpress/data';

接著,site url 的資料在這底下,

可以在區塊編輯器的 console log 當中確認。

wp.data.select('core').getSite().url

我們必須要使用

const siteUrl = useSelect(select => {
		const site = select('core').getSite();
		return site && site.url;
	});

最後再將 {siteUrl} 拿去任何想去的地方使用。

因爲頁面載入順序的關係,我們必須要使用

return site && site.url;

我也不知道道理是啥,我是問 gpt 的

希望能有更加精簡的辦法出現。

文章導覽

接著閱讀

所有文章

相關主題

你可能也會想看

Comments

留言

有想法、問題或補充都可以留下來,我會整理成後續文章或課程更新的方向。