Можно ли использовать routeAction в однофайловых компонентах Glimmer?

Разработка
1

Я могу использовать помощник route-action в файлах шаблонов .hbs следующим образом:

@action={{route-action "showLogin"}}

Могу ли я использовать то же объявление в файле шаблона glimmer? Я пробовал это, но это не работает:

import { routeAction } from 'discourse/helpers/route-action';

[...]

{{on "click" routeAction "showLogin"}}
2

В компоненте Glimmer, я считаю, вам не нужен хелпер. Вы можете сделать это напрямую:

{{on "click" this.showLogin}}

Если вам нужно передать аргументы:

{{on "click" (fn this.showLogin <argument>)}}

Это будет искать действие:

@action
showLogin(<argument>, event) {}
3

Спасибо @Arkshine! Я думаю, что в целом понял, как передавать действия в компоненте Glimmer. Однако хелпер route-action перемещается по иерархии маршрутов для вызова действия, которое не объявлено в локальной области видимости. Так что вы можете просто объявить его в компоненте, например:

{{route-action "showLogin"}}
{{route-action "showCreateAccount"}}
{{route-action "composePrivateMessage"}}

Я мог бы просто работать с шаблоном, меньше беспокоясь о вызываемой логике, поскольку она автоматически передаётся (с моей точки зрения :). Мне это нравилось, но я не понимаю, было ли это когда-либо лучшей практикой и как/имею ли я сейчас доступ к этому в компоненте Glimmer.

4

Ты прав, моя вина. :pensive: Я ответил автоматически, не особо задумываясь. (ну, было 5 утра :smile:).
Сейчас у меня нет ответа на твой вопрос, но я вернусь к тебе, если разберусь в этом на своей стороне!

5

По результатам моего теста, следующее решение работает.

import { get } from "@ember/object";
import { routeAction } from 'discourse/helpers/route-action';

{{on "click" (routeAction "showLogin" (get this "router._router"))}}

Предполагается, что у вас в компоненте определена служба router.

Не уверен, считается ли это плохой практикой. Звучит не как хорошая идея, но работает. :smile:

6

Спасибо еще раз! Согласен, выглядит немного криво :smile: Хотя у меня это тоже не работает… пытаюсь заменить действие в discourse-featured-lists/javascripts/discourse/components/featured-list.gjs at main · nolosb/discourse-featured-lists · GitHub

Возможно, я просто пока откажусь от этой идеи, компонент работает нормально и так. Просто пытаюсь немного лучше понять, как некоторые вещи работают под капотом :mechanic:t4:

7

Думаю, если использовать экспорт по умолчанию, всё должно работать как ожидается (то есть без необходимости внедрять службу router или вручную передавать на неё ссылку).

import routeAction from "discourse/helpers/route-action";

(не совсем понятно, почему также экспортируется внутренняя функция под именем routeAction… довольно запутанно! Давайте это исправим)

Хотя, если говорить в целом, мы стремимся переходить к «закрытым действиям» (closure actions), таким как {{on "click" this.someFunction}}, а не к строковым конструкциям вроде {{action "blah"}} или {{routeAction "blah"}}.