我正在嘗試從作為引數傳遞的 id 創建一個頁面。
我的路線結構：
當我將滑鼠懸停在串列中的某個專案上時，我會獲得 firebase 檔案的 ID，因此我需要創建一個頁面以根據檔案的 ID 顯示檔案中的資料。
http://localhost:3000/category/rent/541KqSMHpU17QuYLihFs
ID：
541KqSMHpU17QuYLihFs
我的 listItem 組件：
<script>
export let listing
export let id
export let handleDelete
import DeleteIcon from '../../static/assets/svg/deleteIcon.svg'
</script>
<li class="categoryListing">
<a href={`/category/${listing.type}/${id}`} class="categoryListingLink">
<img src={listing.imgUrls[0]} alt={listing.name} class="categoryListingImg" />
<div class="categoryListingDetails">
<p class="categoryListingLocation">
{listing.location}
</p>
<p class="CategoryListingName">
{listing.name}
</p>
<p class="categoryListingPrice">
${listing.offer
? listing.discountedPrice.toString().replace(/\B(?=(\d{3}) (?!\d))/g, '.')
: listing.regularPrice.toString().replace(/\B(?=(\d{3}) (?!\d))/g, '.')}
{listing.type === 'rent' ? '/ por mês' : ''}
</p>
<div class="categoryListingInfoDiv">
<img src="/assets/svg/bedIcon.svg" alt="cama" />
<p class="categoryListingInfoText">
{listing.bedrooms > 1 ? `${listing.bedrooms} camas` : `${listing.bedrooms} cama`}
</p>
<img src="/assets/svg/bathtubIcon.svg" alt="banheiro" />
<p class="categoryListingInfoText">
{listing.bathrooms > 1
? `${listing.bathrooms} banheiros`
: `${listing.bathrooms} banheiro`}
</p>
</div>
</div>
</a>
{#if handleDelete}
<DeleteIcon
class="removeIcon"
fill="rgb(231, 76, 60)"
onClick={() => {
handleDelete(listing.id, listing.name)
}}
/>
{/if}
</li>這里重要的是：
<a href={`/category/${listing.type}/${id}`} class="categoryListingLink">
如何讓我的 [listingId] slug 成為 id 頁面？
我的 [listingId].svelte 到目前為止：
<script>
import { page } from '$app/stores'
const listingId = $page.params.listingId
import { db } from '../../../../firebase.config.js'
// get the id parameter from the url
</script>新年快樂！！
uj5u.com熱心網友回復：
一開始我有點理解你的問題。
就目前而言，您的 URI 的形狀為/category/id/[listingId]，因此http://localhost:3000/category/rent/541KqSMHpU17QuYLihFs不會匹配。您需要的是 .URI 形式的 URI /category/[id]/[listingId]。因此，您需要將id目錄重命名[id]為 以使其動態化。
然后，您將能夠以id與您相同的方式檢索listingId：
<script>
import { page } from '$app/stores'
const { id, listingId } = $page.params
import { db } from '../../../../firebase.config.js'
// do stuff
</script>
以上面的 URL 為例，id將持有值'rent'，listingId將持有值'541KqSMHpU17QuYLihFs'。
希望這能回答你的問題（也祝你新年快樂！）
編輯：為更好的，更明確的名稱[id]引數會[listingCategory]，并會改善你的代碼/你的意圖的理解的可讀性。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/400047.html
上一篇：如何比較同一表中的兩行并使用存盤程序回傳資料作為回應
下一篇：如何正確終止HTTP云函式