Регистрация не отображает выбранные элементы - Использование Svelte - PullRequest
Новая
       17

Регистрация не отображает выбранные элементы - Использование Svelte

0 голосов
/ 04 апреля 2020

Что делает этот код: если не выбрано ни одного вкуса, выберите «Пожалуйста, выберите хотя бы один аромат» и «Отображается заказанный вами и отображается неопределенный». Затем, если выбран аромат, ничего не отображается.

Что я пытаюсь сделать: Если не выбран ни один аромат, отображается «Пожалуйста, выберите хотя бы один аромат». Тогда только если что-то выбрано, я хочу отобразить «Вы заказали (затем перечислите все, что они заказали)» ie: Вы заказали чип мяты c, печенье и сливки ».

Я в замешательстве потому что я думал, что ${flavours.slice(0, -1).join(', ')}; & You ordered {join(flavours)} перечислит выбранные ароматы. Это код, с которым я играю (кредит: пример Svelte с сайта Svelte) 

 <script>
        let scoops = 1;
        let flavours = ['Mint choc chip'];

        let menu = [
            'Cookies and cream',
            'Mint choc chip',
            'Raspberry ripple'
        ];

        function join(flavours) {
            if (flavours.length === 1) return flavours[0];
            return `${flavours.slice(0, -1).join(', ')};
        }
    </script>

    <h2>Flavours</h2>

    {#each menu as flavour}
        <label>
            <input type=checkbox bind:group={flavours} value={flavour}>
            {flavour}
        </label>
    {/each}

    {#if flavours.length === 0}
        <p>Please select at least one flavour</p>
        <p>
            You ordered {join(flavours)}
        </p>
    {/if}

1 Ответ

0 голосов
/ 05 апреля 2020

У вас есть несколько ошибок ...

Вам не хватает кавычки (но это синтаксическая ошибка, я думаю, вы бы заметили, если бы у вас это было в исходном коде, потому что это не вообще не работает): 

return `${flavours.slice(0, -1).join(', ')};

// fixed:
return `${flavours.slice(0, -1).join(', ')}`;

// you don't need the quotes here, anyway:
return flavours.slice(0, -1).join(', ');

Вам также не хватает else, поэтому ваш код ничего не отображает при выборе некоторых значений: 

    {#if flavours.length === 0}
        <p>Please select at least one flavour</p>

    {:else} <-- HERE -->

        <p>
            You ordered {join(flavours)}
        </p>
    {/if}

И, наконец, почему slice? Это отбрасывает последнее значение, это действительно то, что вы хотите? 

// fixed
return flavours.join(', ');
...