指向相同 URL 的下拉菜单

Question

我创建了一个下拉菜单，其中有多个选项可供选择。然而，我选择的任何选项都会将我引导到相同的 URL。本例最后写代码。有人可以告诉我我在代码中遗漏了什么吗？

import wixLocation from 'wix-location';

$w.onReady(function () {
    $w("#dropdown1").onChange((event, $w) => {
        console.log(event.target.value); //iPhone X
        wixLocation.to("/iphonex");
    });
});
$w.onReady(function () {
    $w("#dropdown1").onChange((event, $w) => {
        console.log(event.target.value); //iPhone XS
        wixLocation.to("/iphonexs");
    });
});
$w.onReady(function () {
    $w("#dropdown1").onChange((event, $w) => {
        console.log(event.target.value); //iPhone XS MAX
        wixLocation.to("/iphonexsmax");
    });
});

Answer 1

您只需要一个事件处理程序。你需要去值

如果有多个，则执行最后一个

import wixLocation from 'wix-location';

$w.onReady(function () {
    $w("#dropdown1").onChange((event, $w) => {
        var page = event.target.value); //"iPhone X" OR "iPhone XS" etc
        if (page) wixLocation.to("/"+page.replace(/\s+/g,"").toLowerCase());
    });
});

如果您改为将选项的 VALUE 设置为 iphonex、iphonexs 等，那么您只需

    $w("#dropdown1").onChange((event, $w) => {
        var page = event.target.value); // "iphonex" OR "iphonexs" etc
        if (page) wixLocation.to("/"+page)
    });

指向相同 URL 的下拉菜单

Drop down menu directing to same URL

javascript

velo