Документация Engee

Предупреждения

Поскольку фреймворк Genie предназначен для веб-разработки, у него есть ряд особенностей, которые важно учитывать при разработке реактивных приложений. На этой странице перечислены некоторые наиболее распространенные подводные камни и способы, как их избежать.

Доступ к реактивным переменным из кода Julia

При загрузке страницы создаются экземпляры реактивных переменных, помеченных как @in или @out, которые копируются в браузер. После этого будет происходить двухсторонняя (@in) или односторонняя (@out) синхронизация между переменной в коде Julia и ее копией в браузере.

Любые изменения реактивной переменной в коде Julia должны производиться в блоке @onchange. Поэтому следующий код выдаст ошибку типа «неопределенная переменная»:

@app begin
    @in N = 0
end

N += 1

Чтобы этот код заработал, переменная должна обновляться из реактивного обработчика следующим образом:

@app begin
    @in N = 0
    @in button_clicked = false
    @onbutton button_clicked begin
        N += 1
    end
end

Интерполяция переменной

В реактивном приложении Genie интерполировать значение переменной можно с помощью $ или {{}}. Например:

const name = "John"
@app begin
    @out age = "65"
end

ui() = p("Hello $name, you are {{age}} years old")

Оператор $ представляет собой стандартную интерполяцию Julia, которая выполняется перед отправкой страницы в браузер. Поэтому интерполируемые переменные уже должны существовать в коде Julia.

В свою очередь, {{}} интерполирует переменные в браузере. Поэтому для интерполяции переменной она должна быть доступна ​браузеру посредством @in или @out.

Строки кода в компонентах пользовательского интерфейса

Некоторые компоненты пользовательского интерфейса принимают в качестве аргументов строки с исполняемым кодом. Например:

btn("Click me", @click("clicked =! clicked; counter += 1"))
p("The counter is {{counter}}")
p("The counter+10 is {{counter + 10}}")

Любой код, переданный в компонент пользовательского интерфейса, выполняется в браузере. Поэтому это должен быть допустимый код JavaScript.

Индексация с отсчетом от нуля

Так как в JavaScript применяется индексация с отсчетом от 0, при использовании массивов Julia в пользовательском интерфейсе можно получить неожиданные результаты. Например, следующий код будет работать в браузере, но вызовет ошибку в бэкенде Julia:

@app begin
    @out text = ["a", "b", "c"]
end

ui() = p("The first element is {{text[0]}}")