このページのトップへ
Hello Routers

Hello Routers

Get started with routers.

中級.png

中級

2K

出版された:

2023年2月26日

酒を楽しむ少女

によって

アンカー 1
開発者を雇う

説明例

Routers allow you to take control in handling certain incoming requests to your site. Each router defines a URL prefix. All incoming requests to URLs with that prefix pass through router code to determine which page the request will be routed to and what data will be sent to that page.


In this example, we demonstrate how to create a router that reads data from a collection. Depending on the URL used to reach the router, it then passes that data to an index page to display all the items in the collection, or to an individual item page to display detailed information about a specific item. 


For demonstration purposes, we created our router pages to mimic dynamic pages we also added to the site. You can reach the router index page from the menu and the router item pages by following links on the index page.

コード例

タブ1

.

タブ2

.

タブ3

.

このコードによる解決は複雑になる可能性がある。

どのように構築したか

Router Code


The router code can be found in the routers.js file in the backend. The router is built using two functions.


The first function, `helloworld_Router`, handles all requests to the `helloworld` prefix. It begins by reading a value from the request path using the `getRouterData()` function. If there is no value, the router retrieves all the items from the Greetings collection and sends the visitor to the index-page with the greetings data. If there is a value, the router retrieves the corresponding item from the Greetings collection and sends the visitor to the item-page with the greeting data.


The second function, `helloworld_SiteMap`, builds a sitemap for the `helloworld` prefix. It begins by retrieving the items from the Greetings collection, then builds a sitemap entry for each item. It also builds one more sitemap entry for the index page.


Index Page Elements


On the index-page we added a repeater with 2 text elements and a button in each item. The text elements display data from the Greetings collection and the button takes site visitors to the relevant item page.


Index Page Code


On the index-page we begin by retrieving the data sent from the router. We use that data to populate the repeater and its elements.


Item Page Elements


On the item-page we added 2 text elements to display data from the Greetings collection.


Item Page Code


On the item-page we begin by retrieving the data sent from the router. We then use that data to populate the text elements.

使用したAPI

コード以外の例。

関連記事

記事リンク

開発者を雇う

Veloソリューションは強力なツールですが、自力で構築するのは困難です。経験豊富なVelo開発会社に構築をお任せください。

関連例

これは役に立ったか?

はい

|

いいえ

ご意見ありがとう!

画像placeholder.png

カートに入れる ギャラリー

顧客に商品をカートに追加させる

中級.png

中級

画像placeholder.png

エレメントの非表示と表示

ユーザーのインタラクションに応じて要素を隠したり表示したりする

初心者.png

ビギナー

画像placeholder.png

エレメントの非表示と表示

ユーザーのインタラクションに応じて要素を隠したり表示したりする

初心者.png

ビギナー

アンカー2
ページ下