Oktatóanyag: Lapozás hozzáadása a keresési eredményekhez a .NET SDK használatával

Ismerje meg, hogyan implementálhat két különböző lapozórendszert, az elsőt oldalszámok alapján, a másodikat pedig végtelen görgetéssel. Mindkét lapozási rendszert széles körben használják, és a megfelelő kiválasztása attól függ, hogy milyen felhasználói élményt szeretne elérni az eredménnyel.

Ebből az oktatóanyagból megtudhatja, hogyan:

  • Bővítse alkalmazását számozott lapozással
  • Az alkalmazás kiterjesztése végtelen görgetéssel

Áttekintés

Ez az oktatóanyag átfedi a lapozórendszert egy korábban létrehozott projektbe, amelyet az első keresőalkalmazás létrehozása oktatóanyagban ismertet.

Az oktatóanyagban fejlesztendő kód kész verziói a következő projektekben találhatók:

Előfeltételek

  • 1-basic-search-page (GitHub) projekt. Ez a projekt lehet az előző oktatóanyagból készült saját verzió, vagy a GitHub egy példánya.

Bővítsd az alkalmazásod számozott lapozással

A számozott lapozás a lapozási rendszer választása a fő kereskedelmi keresőmotoroknál, valamint sok más keresési weboldalnál. A számozott lapozás általában a tényleges oldalszámok tartományán kívül egy "következő" és egy "előző" lehetőséget is tartalmaz. Az "első oldal" és az "utolsó oldal" lehetőség is elérhető lehet. Ezek a lehetőségek minden bizonnyal szabályozni teszik a felhasználó számára az oldalalapú eredmények között való navigálást.

Ebben az oktatóanyagban olyan rendszert fog hozzáadni, amely tartalmazza az első, az előző, a következő és az utolsó lehetőségeket, valamint az oldalszámokat, amelyek nem 1-től kezdődnek, hanem a felhasználó aktuális lapját veszik körül (tehát például ha a felhasználó a 10. oldalt nyitja meg, akkor a 8., 9., 10., 11. és 12. oldalszám jelenik meg).

A rendszer elég rugalmas lesz ahhoz, hogy lehetővé tegye a látható oldalszámok globális változóban való beállítását.

A rendszer a bal szélső és a jobb oldali oldalszám gombokat speciálisnak fogja kezelni, ami azt jelenti, hogy a megjelenített oldalszámok tartományának módosítását aktiválják. Ha például a 8, 9, 10, 11 és 12 oldalszámok jelennek meg, és a felhasználó a 8-ra kattint, akkor a megjelenített oldalszámok tartománya 6, 7, 8, 9 és 10 lesz. És van egy hasonló eltolódás jobbra, ha ők a 12-es számot választják.

Lapozómezők hozzáadása a modellhez

Nyissa meg az alapszintű keresőoldali megoldást.

  1. Nyissa meg a SearchData.cs modellfájlt.

  2. Globális változók hozzáadása a lapozás támogatásához. Az MVC-ben a globális változók a saját statikus osztályukban vannak deklarálva. A ResultsPerPage a találatok számát állítja be oldalanként. A MaxPageRange a nézetben látható oldalszámok számát határozza meg. A PageRangeDelta meghatározza, hogy hány oldalt kell balra vagy jobbra tolni, ha a bal vagy a jobb oldali oldalszám van kiválasztva. Ez az utóbbi szám általában a MaxPageRange fele. Adja hozzá a következő kódot a névtérhez.

    public static class GlobalVariables
    {
        public static int ResultsPerPage
        {
            get
            {
                return 3;
            }
        }
        public static int MaxPageRange
        {
            get
            {
                return 5;
            }
        }
    
        public static int PageRangeDelta
        {
            get
            {
                return 2;
            }
        }
    }
    

    Jótanács

    Ha ezt a projektet egy kisebb képernyővel (például laptoppal) rendelkező eszközön futtatja, fontolja meg a ResultsPerPage 2-re való módosítását.

  3. Lapozási tulajdonságok hozzáadása a SearchData osztályhoz a searchText tulajdonság után.

    // The current page being displayed.
    public int currentPage { get; set; }
    
    // The total number of pages of results.
    public int pageCount { get; set; }
    
    // The left-most page number to display.
    public int leftMostPage { get; set; }
    
    // The number of page numbers to display - which can be less than MaxPageRange towards the end of the results.
    public int pageRange { get; set; }
    
    // Used when page numbers, or next or prev buttons, have been selected.
    public string paging { get; set; }
    

Lapozási beállítások táblázatának hozzáadása a nézethez

  1. Nyissa meg az index.cshtml fájlt, és adja hozzá a következő kódot közvetlenül a záró </törzscímke> előtt. Ez az új kód a lapozási lehetőségek táblázatát mutatja be: első, előző, 1, 2, 3, 4, 5, következő, utolsó.

    @if (Model != null && Model.pageCount > 1)
    {
    // If there is more than one page of results, show the paging buttons.
    <table>
        <tr>
            <td>
                @if (Model.currentPage > 0)
                {
                    <p class="pageButton">
                        @Html.ActionLink("|<", "Page", "Home", new { paging = "0" }, null)
                    </p>
                }
                else
                {
                    <p class="pageButtonDisabled">|&lt;</p>
                }
            </td>
    
            <td>
                @if (Model.currentPage > 0)
                {
                    <p class="pageButton">
                        @Html.ActionLink("<", "PageAsync", "Home", new { paging = "prev" }, null)
                    </p>
                }
                else
                {
                    <p class="pageButtonDisabled">&lt;</p>
                }
            </td>
    
            @for (var pn = Model.leftMostPage; pn < Model.leftMostPage + Model.pageRange; pn++)
            {
                <td>
                    @if (Model.currentPage == pn)
                    {
                        // Convert displayed page numbers to 1-based and not 0-based.
                        <p class="pageSelected">@(pn + 1)</p>
                    }
                    else
                    {
                        <p class="pageButton">
                            @Html.ActionLink((pn + 1).ToString(), "PageAsync", "Home", new { paging = @pn }, null)
                        </p>
                    }
                </td>
            }
    
            <td>
                @if (Model.currentPage < Model.pageCount - 1)
                {
                    <p class="pageButton">
                        @Html.ActionLink(">", "PageAsync", "Home", new { paging = "next" }, null)
                    </p>
                }
                else
                {
                    <p class="pageButtonDisabled">&gt;</p>
                }
            </td>
    
            <td>
                @if (Model.currentPage < Model.pageCount - 1)
                {
                    <p class="pageButton">
                        @Html.ActionLink(">|", "PageAsync", "Home", new { paging = Model.pageCount - 1 }, null)
                    </p>
                }
                else
                {
                    <p class="pageButtonDisabled">&gt;|</p>
                }
            </td>
        </tr>
    </table>
    }
    

    HTML-táblázatot használunk a dolgok rendezett igazításához. Az összes művelet azonban az @Html.ActionLink utasításokból származik, és mindegyik egy új modellel hívja meg a vezérlőt, amely a korábban hozzáadott lapozási tulajdonság különböző bejegyzéseivel jött létre.

    Az első és az utolsó oldal beállításai nem karakterláncokat, például "első" és "utolsó" karakterláncokat küldenek, hanem a megfelelő oldalszámokat küldik el.

  2. Lapozóosztályok hozzáadása a html-stílusok listájához a hotels.css fájlban. A PageSelected osztály az oldalszámok listájában található az aktuális oldal azonosításához (félkövér formátum alkalmazásával az oldalszámra).

    .pageButton {
        border: none;
        color: darkblue;
        font-weight: normal;
        width: 50px;
    }
    
    .pageSelected {
        border: none;
        color: black;
        font-weight: bold;
        width: 50px;
    }
    
    .pageButtonDisabled {
        border: none;
        color: lightgray;
        font-weight: bold;
        width: 50px;
    }
    

Lapművelet hozzáadása a vezérlőhöz

  1. Nyissa meg a HomeController.cs fájlt, és adja hozzá a PageAsync műveletet. Ez a művelet a kijelölt lapbeállítások bármelyikére reagál.

    public async Task<ActionResult> PageAsync(SearchData model)
    {
        try
        {
            int page;
    
            switch (model.paging)
            {
                case "prev":
                    page = (int)TempData["page"] - 1;
                    break;
    
                case "next":
                    page = (int)TempData["page"] + 1;
                    break;
    
                default:
                    page = int.Parse(model.paging);
                    break;
            }
    
            // Recover the leftMostPage.
            int leftMostPage = (int)TempData["leftMostPage"];
    
            // Recover the search text and search for the data for the new page.
            model.searchText = TempData["searchfor"].ToString();
    
            await RunQueryAsync(model, page, leftMostPage);
    
            // Ensure Temp data is stored for next call, as TempData only stores for one call.
            TempData["page"] = (object)page;
            TempData["searchfor"] = model.searchText;
            TempData["leftMostPage"] = model.leftMostPage;
        }
    
        catch
        {
            return View("Error", new ErrorViewModel { RequestId = "2" });
        }
        return View("Index", model);
    }
    

    A RunQueryAsync metódus most egy szintaxishibát jelenít meg a harmadik paraméter miatt, amelyet egy kicsit később fogunk használni.

    Megjegyzés:

    A TempData hívásai ideiglenes tárolóban tárolnak egy értéket ( objektumot), de ez a tár csak egy hívás esetén marad meg. Ha ideiglenes adatokban tárolunk valamit, az elérhető lesz egy vezérlőművelet következő hívásához, de a hívás ezt követően biztosan eltűnik. A rövid élettartam miatt a keresőszöveget és a lapozási tulajdonságokat ideiglenes tárolóban tároljuk a PageAsync minden egyes hívásához.

  2. Frissítse az Index(modell) műveletet az ideiglenes változók tárolásához, és adja hozzá a bal oldali paramétert a RunQueryAsync-híváshoz .

    public async Task<ActionResult> Index(SearchData model)
    {
        try
        {
            // Ensure the search string is valid.
            if (model.searchText == null)
            {
                model.searchText = "";
            }
    
            // Make the search call for the first page.
            await RunQueryAsync(model, 0, 0);
    
            // Ensure temporary data is stored for the next call.
            TempData["page"] = 0;
            TempData["leftMostPage"] = 0;
            TempData["searchfor"] = model.searchText;
        }
    
        catch
        {
            return View("Error", new ErrorViewModel { RequestId = "1" });
        }
        return View(model);
    }
    
  3. Az előző leckében bevezetett RunQueryAsync metódus módosításra szorul a szintaxishiba megoldása érdekében. A SearchOptions osztály Skip, Size és IncludeTotalCount mezőivel csak egy oldalnyi találatot kérünk le a Kihagyás beállítástól kezdve. A nézethez tartozó lapozási változókat is ki kell számítanunk. Cserélje le a teljes metódust a következő kódra.

    private async Task<ActionResult> RunQueryAsync(SearchData model, int page, int leftMostPage)
    {
        InitSearch();
    
        var options = new SearchOptions
        {
            // Skip past results that have already been returned.
            Skip = page * GlobalVariables.ResultsPerPage,
    
            // Take only the next page worth of results.
            Size = GlobalVariables.ResultsPerPage,
    
            // Include the total number of results.
            IncludeTotalCount = true
        };
    
        // Add fields to include in the search results.
        options.Select.Add("HotelName");
        options.Select.Add("Description");
    
        // For efficiency, the search call should be asynchronous, so use SearchAsync rather than Search.
        model.resultList = await _searchClient.SearchAsync<Hotel>(model.searchText, options).ConfigureAwait(false);
    
        // This variable communicates the total number of pages to the view.
        model.pageCount = ((int)model.resultList.TotalCount + GlobalVariables.ResultsPerPage - 1) / GlobalVariables.ResultsPerPage;
    
        // This variable communicates the page number being displayed to the view.
        model.currentPage = page;
    
        // Calculate the range of page numbers to display.
        if (page == 0)
        {
            leftMostPage = 0;
        }
        else if (page <= leftMostPage)
        {
            // Trigger a switch to a lower page range.
            leftMostPage = Math.Max(page - GlobalVariables.PageRangeDelta, 0);
        }
        else if (page >= leftMostPage + GlobalVariables.MaxPageRange - 1)
        {
            // Trigger a switch to a higher page range.
            leftMostPage = Math.Min(page - GlobalVariables.PageRangeDelta, model.pageCount - GlobalVariables.MaxPageRange);
        }
        model.leftMostPage = leftMostPage;
    
        // Calculate the number of page numbers to display.
        model.pageRange = Math.Min(model.pageCount - leftMostPage, GlobalVariables.MaxPageRange);
    
        return View("Index", model);
    }
    
  4. Végül hajtson végre egy kis változtatást a nézeten. A resultList.Results.TotalCount változó mostantól az egy oldalon visszaadott eredmények számát (a példában 3) tartalmazza, nem pedig a teljes számot. Mivel az IncludeTotalCount értéket igaz értékre állítottuk, a resultList.TotalCount változó mostantól az eredmények teljes számát tartalmazza. Keresse meg, hogy hol jelenjen meg az eredmények száma a nézetben, és módosítsa a következő kódra.

    // Show the result count.
    <p class="sampleText">
        @Model.resultList.TotalCount Results
    </p>
    
    var results = Model.resultList.GetResults().ToList();
    
    @for (var i = 0; i < results.Count; i++)
    {
        // Display the hotel name and description.
        @Html.TextAreaFor(m => results[i].Document.HotelName, new { @class = "box1" })
        @Html.TextArea($"desc{1}", results[i].Document.Description, new { @class = "box2" })
    }
    

    Megjegyzés:

    Az IncludeTotalCount igazra állítása kis teljesítménycsökkenést okozhat, mivel ezt az összesítést az Azure Cognitive Searchnek kell kiszámítania. Összetett adathalmazok esetén figyelmeztetés van arra, hogy a visszaadott érték közelítés. Mivel a szálloda keresési korpusza kicsi, pontos lesz.

Az alkalmazás fordítása és futtatása

Most válassza az Indítás hibakeresés nélkül (vagy nyomja le az F5 billentyűt).

  1. Keressen egy sztringre, amely rengeteg eredményt ad vissza (például "wifi"). Tudsz szépen végiglapozni az eredményeken?

    Számozott lapozás a

  2. Kattintson a jobb és a későbbi, bal oldali oldalszámokra. Az oldalszámok megfelelően módosulnak, hogy a jelenlegi oldalt középen jelezzék?

  3. Hasznos az "első" és az "utolsó" lehetőség? Egyes kereskedelmi keresőmotorok ezeket a lehetőségeket használják, míg mások nem.

  4. Ugrás az eredmények utolsó oldalára. Az utolsó oldal az egyetlen lap, amely kevesebb találatot tartalmazhat, mint a ResultsPerPage eredménye.

    A

  5. Írja be a "város" kifejezést, és kattintson a keresésre. Nem jelennek meg lapozási beállítások, ha az eredmények egynél kevesebb oldalból állnak.

Mentse ezt a projektet, és folytassa a következő szakaszsal a lapozás alternatív formájához.

Az alkalmazás kiterjesztése végtelen görgetéssel

A végtelen görgetés akkor aktiválódik, ha egy felhasználó egy függőleges görgetősávot görget a megjelenített eredmények utolsójára. Ebben az esetben a keresési szolgáltatás meghívása a következő találati lapra történik. Ha nincs több eredmény, a rendszer nem ad vissza semmit, és a függőleges görgetősáv nem változik. Ha több találat van, azokat hozzáfűzi az aktuális laphoz, és a görgetősáv úgy változik, hogy több találat is elérhető legyen.

Fontos megjegyezni, hogy az aktuális oldal nem cserélődik le, hanem ki van terjesztve a további eredmények megjelenítéséhez. A felhasználók mindig visszagörgethetnek a keresés első eredményeihez.

A végtelen görgetés implementálásához kezdjük el a projektet, még mielőtt az oldalszám-görgető elemeket hozzáadtuk volna. A GitHubon ez a FirstAzureSearchApp megoldás.

Lapozómezők hozzáadása a modellhez

  1. Először adjon hozzá egy lapozótulajdonságot a SearchData osztályhoz (a SearchData.cs modellfájlban).

    // Record if the next page is requested.
    public string paging { get; set; }
    

    Ez a változó egy sztring, amely a "következő" értéket tartalmazza, ha a találatok következő oldalát küldeni kell, vagy null értékű, ha a keresés első oldala.

  2. Ugyanabban a fájlban és a névtérben adjon hozzá egy globális változóosztályt egy tulajdonsággal. Az MVC-ben a globális változók a saját statikus osztályukban vannak deklarálva. A ResultsPerPage a találatok számát állítja be oldalanként.

    public static class GlobalVariables
    {
        public static int ResultsPerPage
        {
            get
            {
                return 3;
            }
        }
    }
    

Függőleges görgetősáv hozzáadása a nézethez

  1. Keresse meg az index.cshtml fájl azon szakaszát, amely megjeleníti az eredményeket (a @if (Model != null)) kezdődik).

  2. Cserélje le a szakaszt az alábbi kódra. Az új <div> szakasz a görgethető terület körül helyezkedik el, és hozzáad egy overflow-y attribútumot, valamint egy onscroll függvényhívást "scrolled()" névvel.

    @if (Model != null)
    {
        // Show the result count.
        <p class="sampleText">
            @Model.resultList.TotalCount Results
        </p>
    
        var results = Model.resultList.GetResults().ToList();
    
        <div id="myDiv" style="width: 800px; height: 450px; overflow-y: scroll;" onscroll="scrolled()">
    
            <!-- Show the hotel data. -->
            @for (var i = 0; i < results.Count; i++)
            {
                // Display the hotel name and description.
                @Html.TextAreaFor(m => results[i].Document.HotelName, new { @class = "box1" })
                @Html.TextArea($"desc{i}", results[i].Document.Description, new { @class = "box2" })
            }
    
  3. Közvetlenül a hurok alatt, a </div> címke után adja hozzá a görgetett funkciót.

    <script>
        function scrolled() {
            if (myDiv.offsetHeight + myDiv.scrollTop >= myDiv.scrollHeight) {
                $.getJSON("/Home/NextAsync", function (data) {
                    var div = document.getElementById('myDiv');
    
                    // Append the returned data to the current list of hotels.
                    for (var i = 0; i < data.length; i += 2) {
                        div.innerHTML += '\n<textarea class="box1">' + data[i] + '</textarea>';
                        div.innerHTML += '\n<textarea class="box2">' + data[i + 1] + '</textarea>';
                    }
                });
            }
        }
    </script>
    

    A fenti szkript if utasítása azt ellenőrzi, hogy a felhasználó görgetett-e a függőleges görgetősáv aljára. Ha igen, a Home vezérlő hívása a NextAsync nevű műveletre történik. A vezérlőnek nincs szüksége más információra, a következő adatoldalt adja vissza. Ezek az adatok ezután az eredeti oldalhoz hasonló HTML-stílusokkal lesznek formázva. Ha nincs visszatérő eredmény, nem kerül hozzáfűzésre semmi, és a dolgok változatlanok maradnak.

A Következő művelet kezelése

Csak három műveletet kell elküldeni a vezérlőnek: az alkalmazás első futtatása, amely meghívja az Index()-et, a felhasználó első keresését, amely az Index(modell)-t hívja meg, majd az azt követő hívások további találatokat keresnek a Next(modell)-en keresztül.

  1. Nyissa meg az otthoni vezérlőfájlt, és törölje a RunQueryAsync metódust az eredeti oktatóanyagból.

  2. Cserélje le az Index(modell) műveletet a következő kódra. Mostantól kezeli a lapozómezőt, amikor az null értékre van állítva, vagy "tovább" állapotra van állítva, valamint kezeli az Azure Cognitive Search hívásait.

    public async Task<ActionResult> Index(SearchData model)
    {
        try
        {
            InitSearch();
    
            int page;
    
            if (model.paging != null && model.paging == "next")
            {
                // Increment the page.
                page = (int)TempData["page"] + 1;
    
                // Recover the search text.
                model.searchText = TempData["searchfor"].ToString();
            }
            else
            {
                // First call. Check for valid text input.
                if (model.searchText == null)
                {
                    model.searchText = "";
                }
                page = 0;
            }
    
            // Setup the search parameters.
            var options = new SearchOptions
            {
                SearchMode = SearchMode.All,
    
                // Skip past results that have already been returned.
                Skip = page * GlobalVariables.ResultsPerPage,
    
                // Take only the next page worth of results.
                Size = GlobalVariables.ResultsPerPage,
    
                // Include the total number of results.
                IncludeTotalCount = true
            };
    
            // Specify which fields to include in results.
            options.Select.Add("HotelName");
            options.Select.Add("Description");
    
            // For efficiency, the search call should be asynchronous, so use SearchAsync rather than Search.
            model.resultList = await _searchClient.SearchAsync<Hotel>(model.searchText, options).ConfigureAwait(false);               
    
            // Ensure TempData is stored for the next call.
            TempData["page"] = page;
            TempData["searchfor"] = model.searchText;
        }
        catch
        {
            return View("Error", new ErrorViewModel { RequestId = "1" });
        }
    
        return View("Index", model);
    }
    

    A számozott lapozási módszerhez hasonlóan a Skip and Size keresési beállításokat használjuk, hogy csak a szükséges adatokat kérjük vissza.

  3. Adja hozzá a NextAsync műveletet az otthoni vezérlőhöz. Figyelje meg, hogyan adja vissza a listát, minden szálloda két elemet ad hozzá a listához: egy szálloda nevét és egy szálloda leírását. Ez a formátum úgy van beállítva, hogy a görgetett függvény nézetbeli visszaadott adatok használatának megfeleljen.

    public async Task<ActionResult> NextAsync(SearchData model)
    {
        // Set the next page setting, and call the Index(model) action.
        model.paging = "next";
        await Index(model).ConfigureAwait(false);
    
        // Create an empty list.
        var nextHotels = new List<string>();
    
        // Add a hotel name, then description, to the list.
        await foreach (var searchResult in model.resultList.GetResultsAsync())
        {
            nextHotels.Add(searchResult.Document.HotelName);
            nextHotels.Add(searchResult.Document.Description);
        }
    
        // Rather than return a view, return the list of data.
        return new JsonResult(nextHotels);
    }
    
  4. Ha szintaxishiba lép fel a List<string> kódnál, adja hozzá a következő using direktívát a vezérlőfájl elejére.

    using System.Collections.Generic;
    

A projekt fordítása és futtatása

Most válassza az Indítás hibakeresés nélkül (vagy nyomja le az F5 billentyűt).

  1. Adjon meg egy kifejezést, amely rengeteg eredményt ad (például "készlet"), majd tesztelje a függőleges görgetősávot. Aktivál egy új találatoldalt?

    Végtelen görgetés a

    Jótanács

    Annak érdekében, hogy egy görgetősáv megjelenjen az első oldalon, az eredmények első oldalának kissé meg kell haladnia a megjelenített terület magasságát. A példánkban a .box1 30 képpontos, a .box2 100 képpontos magasságú , az alsó margó pedig 24 képpont. Így minden bejegyzés 154 képpontot használ. Három bejegyzés 3 x 154 = 462 képpontot vesz igénybe. A függőleges görgetősáv megjelenésének biztosításához a megjelenítési terület magasságát 462 képpontnál kisebbre kell állítani, akár 461-et is. Ez a probléma csak az első oldalon jelentkezik, utána pedig biztosan megjelenik egy görgetősáv. A frissítendő sor: <div id="myDiv" style="width: 800px; height: 450px; overflow-y: scroll;" onscroll="scrolled()">.

  2. Görgessen lefelé az eredmények aljára. Figyelje meg, hogy az összes információ most már az egy nézetoldalon található. A kiszolgálóhívások aktiválása nélkül felgörgethet egészen a tetejéig.

A kifinomultabb végtelen görgetőrendszerek az egérkerékkel vagy hasonló más mechanizmussal aktiválhatják egy új találati lap betöltését. Ezekben az oktatóanyagokban nem fogjuk tovább görgetni a végtelen görgetést, de van egy bizonyos varázsa, mivel elkerüli az extra kattintásokat, és érdemes lehet további lehetőségeket megvizsgálni.

Főbb tanulságok

Vegye figyelembe a projekt alábbi tanulságait:

  • A számozott lapozás olyan keresésekhez hasznos, ahol a találatok sorrendje kissé tetszőleges, ami azt jelenti, hogy a későbbi oldalakon a felhasználók számára is érdekes lehet valami.
  • A végtelen görgetés akkor hasznos, ha az eredmények sorrendje különösen fontos. Ha például az eredmények a cél város központjától való távolságra vannak rendezve.
  • A számozott lapozás jobb navigációt tesz lehetővé. A felhasználók például emlékezhetnek arra, hogy egy érdekes eredmény a 6. oldalon történt, míg a végtelen görgetésben nincs ilyen egyszerű hivatkozás.
  • Az végtelen görgetés könnyen vonzó, hiszen felfelé és lefelé lehet görgetni anélkül, hogy oldalszámokra kellene kattintani.
  • A végtelen görgetés egyik fő funkciója, hogy az eredmények hozzá vannak fűzve egy meglévő laphoz, és nem helyettesítik az oldalt, ami hatékony.
  • Az ideiglenes tárterület csak egy hívás esetén marad fenn, és alaphelyzetbe kell állítani a további hívások túléléséhez.

Következő lépések

A lapozás alapvető fontosságú a keresési élmény szempontjából. A lapozás jól lefedett, így a következő lépés a felhasználói élmény további javítása azzal, hogy gépelés közbeni javaslatokkal bővítjük.