query

Gets an object that represents the query segment of the current page's URL.

Description

Premium sites: Premium site query

Free sites: Free site query

Type:

ObjectRead Only

Was this helpful?

Get the query of the current page's URL

Copy Code

1import wixLocationFrontend from 'wix-location-frontend';
2
3// Premium site URL: "https://www.domain.com/animals/elephant?species=african-elephant#desc"
4// Free site URL: "https://user_name.wixsite.com/zoo/animals/elephant?species=african-elephant#desc"
5
6
7let query = wixLocationFrontend.query; // {"species": "african-elephant"}

Add, update, remove, and get URL query parameters

Note: It's easiest to test this example in a published version of your site. If you test using preview, you will see a lot of extra query parameters from the Editor URL. You can test out the code in our example template.

Copy Code

1import wixLocationFrontend from 'wix-location-frontend';
2
3$w.onReady(function () {
4  $w("#addButton").onClick((event) => {
5    const key = $w('#addKey').value;
6    const value = $w('#addValue').value;
7    if (key && value) {
8      const toAdd = { [key]: value };
9      wixLocationFrontend.queryParams.add(toAdd);
10      $w('#addKey').value = undefined;
11      $w('#addValue').value = undefined;
12    }
13  });
14
15  $w("#removeButton").onClick((event) => {
16    const paramToRemove = [$w('#removeKey').value];
17    wixLocationFrontend.queryParams.remove(paramToRemove);
18    $w('#removeKey').value = undefined;
19  });
20
21  $w("#getButton").onClick((event) => {
22    const query = wixLocationFrontend.query;
23    if (query) {
24      $w('#getText').value = JSON.stringify(query, null, 2);
25    }
26  });
27});