Загрузка тем в новом плагине outlet, который я добавил

Разработка
1

Привет. Я пытаюсь передать список тем в {{topic-list topics=myChosenTopics}} в новом шаблоне, который я создал в плагине.

Итак, я пытаюсь понять, как установить значение для «myChosenTopics» в моём JS-файле, чтобы его можно было передать в topic-list.

Самое близкое, что я нашёл, — это метод setupComponent(args, component) {..component.set('myChosenTopics', myChosenTopics);, описанный здесь: https://meta.discourse.org/t/how-to-add-a-featured-topic-list-to-your-discourse-homepage/132949.

Есть ли лучший способ?

Если нет, то, похоже, этот метод работает только при привязке к классу-коннектору (то есть через плагин-аутлет). Нужно ли мне предпринять какие-то специальные шаги, чтобы добавить новый плагин-аутлет в шаблон?

2

Кажется, мне удалось заставить это работать. Цель: загрузка определённых тем в указанное место нового шаблона (вероятно, это также работает для добавления в существующие шаблоны, но я это не тестировал):

  1. Вставьте свой вымышленный плагин-розетку в шаблон (мой вымышленный плагин-розетка называется “great-topics”, например):

{{plugin-outlet name="great-topics"}}

  1. Добавьте код Handlebars (то есть ваш компонент) в коннектор:

[ваш-плагин]/assets/javascripts/discourse/connectors/great-topics/new-component.hbs

<div>Я в плагин-розетке! Загрузить темы:</div>
{{topic-list topics=featuredTopics showPosters=true}}
  1. Добавьте JavaScript-код для компонента, который находится в вашем новом коннекторе:

[ваш-плагин]/assets/javascripts/discourse/connectors/great-topics/new-component.js.es6
[этот код адаптирован из следующего поста на Meta, где есть код для загрузки тем с тегом “featured”: https://meta.discourse.org/t/how-to-add-a-featured-topic-list-to-your-discourse-homepage/132949]

const ajax = require('discourse/lib/ajax').ajax;
const Topic = require('discourse/models/topic').default;

setupComponent(args, component) {
 ajax("/tag/featured.json").then(function (result) {
                 
   let featuredTopics = [];
   // Создаём пустой массив, в который будем добавлять темы

   var featuredUsers = result.users;
   // Получаем соответствующих пользователей

   result.topic_list.topics.slice(0, 4).forEach(function (topic) {
   // Извлекаем темы, начиная с 0 и заканчивая 4
   // Это означает, что мы покажем всего 3 темы. Увеличьте 4, чтобы показать больше.

     topic.posters.forEach(function (poster) {
        poster.user = $.grep(featuredUsers, function (e) { return e.id == poster.user_id; })[0];
                        });
         // Связываем пользователей с нашей темой

      featuredTopics.push(Topic.create(topic));
        // Добавляем наши темы в массив featuredTopics
     });
   }) //конец result.topic.topic_list...
                    
component.set('featuredTopics', featuredTopics);  //именно здесь темы добавляются в компонент
 
component.set("loadingTopics", false); //в моём коде выше нет индикатора загрузки, но он нужен, если вы хотите его использовать. Для этого также нужно добавить соответствующий код в hbs-файл. См. связанный пост на Meta выше

  }); //конец ajax 


 }//конец setup component

У меня это работает, по крайней мере, для загрузки тем с тегом “featured” в плагин-розетку моего нового шаблона.

Чтобы увидеть это в действии, необходимо перезапустить сервер.

3

Эта идея звучит интересно.