Почему я не могу получить доступ к реактивной переменной "$:" внутри тегов скрипта в svelte3?

Question

Я новичок в стройности, начал это неделю назад...

Я пытаюсь узнать об этом, я действительно любил... ï¸ â ï¸ это, но у меня проблема... ☹ï¸

Я пытаюсь получить доступ к переменной $: в тегах скрипта, но получаю сообщение об ошибке Cannot access 'greeting' before initialization.

<script>
    let name = 'world';
    $: greeting = `Hello ${name}`
    console.log(greeting)
</script>

<h1>Hello {name}!</h1>

Я также попытался объявить переменную с помощью let перед ее использованием

    let greeting

Но в этом случае console.log выходы undefined.

Answer 1

Решение вашей проблемы - сделать console.log(greeting) также реактивный оператор:

<script>
    let name = 'world';
    $: greeting = `Hello ${name}`
    $: console.log(greeting)
</script>

<h1>Hello {name}!</h1>

Потому как console.logне является реактивным оператором в вашем примере, он фактически выполняется перед любым реактивным оператором после "нормального" выполнения потока вашего скрипта. Итак, когда он выполняетсяgreeting еще не настроен (ваша первая ошибка) или установлен на undefined сквозь let greeting объявление (ваша вторая ошибка).

Сделав console.logреактивный, вы гарантируете, что он будет выполнен (а) после greetingбыл установлен (что решает вашу первую проблему), и (б) каждый раз greetingустановлен (что решает вашу вторую проблему). И вам не нужно объявлятьgreeting перед присвоением ему значения в реактивном операторе.