Question

我正在研究阿拉伯语 - 俄语字典，可由用户编辑。我遇到了一个问题，我不明白。我正在使用火焰。并且有结构的想法：

<ModalForm>
    <ArticleForm>
</ModalForm>
<ArticlePage>
    <ArticlesList>
         <ArticleSingle><ArticleForm>
    </ArticlesList>
</ArticlePage>

模式表单会打开ArticleForm以插入新的Article，然后将页面重定向到新的ArticlePage。

ArticlesList包裹了<ArticleSingle><ArticleForm>的夫妻。其中一个是可见的，它取决于editMode参数。 ArticlePage将数组从一篇文章（[articles.findOne]）传递给ArticlesList。

当我添加时，第一篇文章重定向工作正常，并打开一个带有新Article的页面。只使用了一个ArticlePage模板，其中包含一个文章实例。重定向适用于after-insert-hook（collections-hooks）。

但是当我第二次重复时，会出现错误Exception from Tracker recompute function:

image|690x111

ArticlePage无法呈现，在控制台中，我看到两个ArticlePage来电，第一个是真实数据，第二个是undefined。我无法理解这个＆＃34; undefined＆＃34;文章来自。

如果我重新加载该空白页面，它将与新文章一起很好地呈现。

更新

只有在我尝试从/articles/xxxx重定向到/articles/yyyy时才会出现此错误。从主页/重定向到/articles/xxxx可以正常工作很多次。

这是它的外观。 error%20of%20redirect|690x353

代码

组件处理显示夫妇ArticleSingle - ArticleEditForm，用于文章列表（在搜索页面上，在ActiveCorrections页面上等），也在ArticlePage上，当它只显示一篇文章时，将其包装成数组[文章]。

ArticlePage.html

＆＃13;

<template name="ArticlePage">
    <div class="container article-page">
        <section class="row">
            {{#if Template.subscriptionsReady}}
                {{> ArticlesList articles=articles}}
            {{else}}
                <p>Loading...</p>
            {{/if}}
        </section>
    </div>
</template>

＆＃13;

ArticlePage.js

＆＃13;

import { Articles } from "/imports/api/articles.js";

Template.ArticlePage.onCreated(function() {
  var self = this;
  var id = FlowRouter.getParam("id");
  self.autorun(function() {
    self.subscribe("articleSingle", id);
  });
});

Template.ArticlePage.helpers({
  articles() {
    const id = FlowRouter.getParam("id");
    const article = Articles.findOne({ _id: id });
    console.log("articlePage article", article);
    return [article];
  },
  isAdmin() {
    return Roles.userIsInRole(loggedInUser, ['admin'])
  }
});

＆＃13;

ArticlesList.html

＆＃13;

<template name="ArticlesList">
    <div class="articles-list">
        {{#each articles}}
            <section class="row">
                <div class="col-sm-6 -sticky">
                    <div class="main-article">
                        {{> ArticleSingle}}
                    </div>
                </div>
                <div class="col-sm-6">
                    {{#if showEditForm _id}}
                        {{> ArticleForm }}
                    {{else}}
                        {{#each corrections }}
                        <div class="correction">
                            {{#if showEditForm _id}}
                                {{> ArticleForm }}
                            {{else}}
                                {{> ArticleSingle }}
                            {{/if}}
                        </div>
                        {{/each}}
                    {{/if}}
                </div>
            </section>
        {{/each}}
    </div>
</template>

＆＃13;

ArticlesList.js

＆＃13;

Template.ArticlesList.onCreated(function() {
  Session.set("showEditFormForArticle", "");
});

Template.ArticlesList.helpers({
  showEditForm(articleId) {
    return articleId == Session.get("showEditFormForArticle");
  },
  corrections() {
    if (this.corrections)
      return this.corrections.map(elem => {
        return { ...elem, _id: elem._id + "-by-" + elem.editedByUserName };
      });
    else [];
  }
});

Template.ArticlesList.events({
  "click .correction .btn-success"() {
    let doc_id = this._id.split("-")[0];
    Meteor.call("articles.accept_correction", doc_id, this);
  },
  "click .correction .btn-danger"() {
    let doc_id = this._id.split("-")[0];
    Meteor.call("articles.reject_correction", doc_id, this);
  },
  "click .main-article .btn-success"() {
    let doc_id = this._id.split("-")[0];
    Meteor.call("articles.accept", doc_id, this);
  },
  "click .main-article .btn-danger"() {
    let doc_id = this._id.split("-")[0];
    Meteor.call("articles.reject", doc_id, this);
  }
});

＆＃13;

显示单词的字典，包括单词，注释，翻译和示例。

ArticleSingle.html

＆＃13;

<template name="ArticleSingle">

<div id="article-{{_id}}" class="panel panel-default article {{#if notPublished}}-opacity-06{{/if}}">
  <div class="panel-heading">
        <div class="panel-title words">
            <div class="label label-info speach-part">{{speachPart}}</div>
            <!-- Глагол 1й породы имеет дополнительную информацию для вывода, поэтому 
            особый шаблон его вывода, например, среднекорневую глассную и масдары -->

                {{#each words}}
                    <div class="note">{{note}} </div>
                    <div class="word -arabic-text-big">{{word}}</div>
                    <div class="collapse transcription">{{transcr word}}</div>
                    {{#if isMiddleHarakat ../middleHarakat @index}}
                        <div class="note middleHaracat" title="среднекорневая гласная настоящего времени">
                                {{../middleHarakat}} 
                        </div>
                    {{/if}}
                {{/each}}
            <button type="button" class="btn btn-default btn-xs btn-transcript" 
                data-toggle="collapse" data-target="#article-{{_id}} .transcription">
                Транскрипция
            </button>
        </div>
  </div>
  <div class="panel-body">
        <ol class="translations">
            {{#each translations}}
                <li class="translation">
                    {{translation}}
                    {{#if examplesCount examples}}
                        <a href="" class="showExamplesButton" data-toggle="collapse" title="примеры" data-target=".examples-{{../_id}}-{{@index}}">
                            <small><i class="glyphicon glyphicon-asterisk"></i> 
                            {{examplesCount examples}}</small>
                        </a>
                        <ul class="examples collapse examples-{{../_id}}-{{@index}}">
                            {{#each examples}}
                                <li>
                                    <div class="example -arabic-text-mid">{{example}}</div>
                                    <div class="translation">{{translation}}</div>
                                </li>
                            {{/each}}
                        </ul>
                    {{/if}}
                </li>
            {{/each}}
        </ol>
        {{#if image.link}}
            <div class="image">
                <img class="img-responsive img-rounded" src="{{image.link}}" alt="ArticleImage">
            </div>
        {{/if}}

        <!-- TAGS -->

        {{#if tagsRoots}}
            <div>
                Корень: {{> TagsSelectedSynonyms tags=tagsRoots removeButton=false}}
            </div>
        {{/if}}
        {{#if tagsSubjects}}
            <div>
                Тематики: {{> TagsSelectedSubjects tags=tagsSubjects removeButton=false}}
            </div>
        {{/if}}
        {{#if tagsSynonyms}}
            <div>
                Синонимы: {{> TagsSelectedSynonyms tags=tagsSynonyms removeButton=false}}
            </div>
        {{/if}}                
        
  </div>
  <div class="panel-footer">
        {{> ArticleMenu }}
        {{> ArticleCorrectionMenu}}
        {{#if showApproveButtons}}
            {{> ApproveButtons}}
        {{/if}}
  </div>
</div>
</template>

＆＃13;

ArticleSingle.js

＆＃13;

import { Articles } from "/imports/api/articles.js";
import { Subjects } from "/imports/api/subjects.js";
import { transcription, isNotDiacritic } from "/imports/transcription.js";

Template.ArticleSingle.onCreated(function() {
  Meteor.subscribe("subjects");
  Meteor.subscribe("articlesByIds", this.data.synonyms);
  Meteor.subscribe("articlesByIds", this.data.roots);
});

Template.ArticleSingle.helpers({
  showApproveButtons() {
    return (
      Roles.userIsInRole(loggedInUser, ['admin']) &&
      this.published === false &&
      this.deleted !== true
    );
  },
  notPublished() {
    return this.published === false;
  },
  isMiddleHarakat(middleHarakat, index) {
    return middleHarakat && index == 0;
  },
  rootArticle() {
    Meteor.subscribe("articleSingle", this.rootId);
    return Articles.findOne({ _id: this.rootId });
  },
  image() {
    const image = Images.findOne({ _id: this.picture });
    return image;
  },
  imageJSON() {
    const image = Images.findOne({ _id: this.picture });
    image0 = JSON.stringify(image.fetch());
    return image0;
  },
  examplesCount: function(examples) {
    return examples.length || 0;
  },
  transcr: function(text) {
    if (text.trim()) return "[ " + transcription(text) + " ]";
  },
  tagsSubjects() {
    const ids = this.subjects;
    const tags = [];
    let tagsUnordered = Subjects.find({ _id: { $in: ids } }).fetch(); // эта шляпа возвращает массив в смешанном порядке, поэтому их надо заново упорядочить
    ids.forEach(tagId => {
      tags.push(
        tagsUnordered.filter(elem => {
          return elem._id == tagId;
        })[0]
      );
    });
    return tags;
  },
  tagsSynonyms() {
    const ids = this.synonyms;
    const tags = [];
    let tagsUnordered = Articles.find({ _id: { $in: ids } }).fetch();
    // эта шляпа { $in: ids } возвращает массив в смешанном порядке, поэтому их надо заново упорядочить
    ids.forEach(tagId => {
      tags.push(
        tagsUnordered.filter(elem => {
          return elem._id == tagId;
        })[0]
      );
    });
    return tags;
  },
  tagsRoots() {
    const ids = this.roots;
    const tags = [];
    let tagsUnordered = Articles.find({ _id: { $in: ids } }).fetch();
    // эта шляпа { $in: ids } возвращает массив в смешанном порядке, поэтому их надо заново упорядочить
    ids.forEach(tagId => {
      tags.push(
        tagsUnordered.filter(elem => {
          return elem._id == tagId;
        })[0]
      );
    });
    return tags;
  }
});

＆＃13;

奇怪的是，当我在Template.ArticleSingle.onCreated console.log（this）中创建时，当我从主页面/添加文章时，在重定向之后只有一个TemplateInstance，它渲染得很好。但是当我从y页面创建文章article/x时，在从现有页面article/x重定向到新创建的article/y页面后，在控制台中有3个TemplateInstances，其中第三个{{ 1}}。我仍然不明白它出现在哪里:(

Answer 1

最后，我找到了答案（有好人帮助）：

ArticlePage.js：

＆＃13;

Template.ArticlePage.onCreated(function() {
  var self = this;
  self.autorun(function() {
    const id = FlowRouter.getParam("id");
    if (id) {
      self.subscribe("articleSingle", id);
    }
  });
});

＆＃13;

重定向后重新呈现FlowRouter.getParam("id")为undefined，我们没有订阅。现在一切顺利。

出现意外的文章='undefined'并分解我的应用程序（跟踪器重新计算功能的例外情况:)

代码

1 个答案: