추가한 새 플러그인 아웃렛에 토픽 로딩

개발
1

안녕하세요. 제가 플러그인에서 새로 만든 템플릿에 {{topic-list topics=myChosenTopics}}에 주제 목록을 전달하려고 합니다.

즉, topic-list에 전달할 수 있도록 JS 파일에서 “myChosenTopics” 값을 어떻게 설정해야 하는지 알아보고 있습니다.

가장 근접한 해결책은 https://meta.discourse.org/t/how-to-add-a-featured-topic-list-to-your-discourse-homepage/132949에 설명된 setupComponent(args, component) {..component.set('myChosenTopics', myChosenTopics); 메서드입니다.

더 나은 방법이 있을까요?

만약 없다면, 이 방법은 커넥터 클래스(즉, 플러그인 아웃렛)에 링크할 때만 작동하는 것 같습니다. 템플릿에 새로운 플러그인 아웃렛을 추가하려면 특별한 단계가 필요한가요?

2

이것이 작동하도록 설정한 것 같습니다. 목표: 새 템플릿의 지정된 위치에 특정 주제(topics)를 로드하는 것입니다 (기존 템플릿에 추가하는 경우에도 작동할 가능성이 높지만, 이는 테스트하지 않았습니다):

  1. 템플릿에 직접 만든 플러그인 아웃렛을 삽입하세요 (제 경우 만든 플러그인 아웃렛 이름은 "great-topics"입니다. 예시):

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

  1. 커넥터(connector)에 핸들바(handlebars) 코드(즉, 컴포넌트)를 추가하세요:

[your-plugin]/assets/javascripts/discourse/connectors/great-topics/new-component.hbs

<div>I am in the plugin outlet! Load the topics:</div>
{{topic-list topics=featuredTopics showPosters=true}}
  1. 새 커넥터에 있는 컴포넌트의 자바스크립트 코드를 추가하세요:

[your-plugin]/assets/javascripts/discourse/connectors/great-topics/new-component.js.es6
[이 코드는 “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 = [];
   // Create an empty array, we'll push topics into it

   var featuredUsers = result.users;
   // Get the relevant users

   result.topic_list.topics.slice(0, 4).forEach(function (topic) {
   // We're extracting the topics starting at 0 and ending at 4
   // This means we'll show 3 total. Increase 4 to see more.

     topic.posters.forEach(function (poster) {
        poster.user = $.grep(featuredUsers, function (e) { return e.id == poster.user_id; })[0];
                        });
         // Associate users with our topic

      featuredTopics.push(Topic.create(topic));
        // Push our topics into the featuredTopics array
     });
   }) //end result.topic.topic_list...
                    
component.set('featuredTopics', featuredTopics);  //this is where the topics get added to the component
 
component.set("loadingTopics", false); //my above code doesn't have a loader. but this is there if you do want a loader. Have to add to hbs file for that in addition. See linked post on meta above

  }); //end ajax 


 }//end setup component

적어도 제 경우, 이 방법으로 새 템플릿의 플러그인 아웃렛에 “featured” 태그가 있는 주제를 로드하는 데 성공했습니다.

이것이 작동하는 것을 확인하려면 서버를 재시작해야 합니다.

3

이 아이디어는 흥미롭네요.