使用 Meteor 将事件对象传递到模板中

Question

我正在构建一个应用程序，用于自定义电子商务网站的产品网格顺序。能够以响应迅速且灵活的方式呈现产品订单，确实可以让项目经理更轻松地为他们的客户创造更好的体验。

此网格订单应用程序的一部分基于 Ryan Glover（我非常感谢他）的一篇文章，名为 Importing CSV's https://themeteorchef.com/tutorials/importing-csvs，使用 PapaParse。

尽管模板和构建是在 Meteor 中，但这有点像一个普通的 JavaScript 问题。

这是我非常精简的问题：如何将event object 放入template？我从Papa.parse() 函数中得到event object 很好，并且可以console.log(it)。但是，我如何将event object 传递到模板中。

import { Template } from 'meteor/templating';
import { ReactiveVar } from 'meteor/reactive-var';
import './main.html';

// NOTE: trying to figure out how to pass event object to template
Template.upload.events({
  'change [name="uploadCSV"]' ( event, template ) {
  // Handles the conversion and upload
    var fileInput = document.querySelector('[name="uploadCSV"]');

    // Parse local CSV file
    Papa.parse(fileInput.files[0], {
      header: true,
        complete: function(results) {
            // console.log(results); // includes data, error, and misc

// NOTE: This is the data object to send to the template
        let itemData = results.data;
        console.log(itemData) // here is the data object

        // This test correctly iterates over the object, but should be done in the template
        itemData.forEach(function(item) {
          console.log(item)
          // console.log(item['itemcode'])
        });

// HELP! How do I send the object itemData to the template?

        } // END complete
    }); // END parse

  } // END change
}) // END events

这里是回购的链接。 https://github.com/dylannirvana/gridorderapp/tree/master/meteor/vanilla

这必须非常容易。提前谢谢了！

Answer 1

查看您的项目将清楚地表明这件作品还没有准备好。你的问题不是关于events 而是理解流星。缺少必需品。

首先检查您的grid 模板，没有定义数据。其次，通过Meteor.method了解客户端和服务器上的Papa.parse

不确定您的概念应该如何运行，但我们假设有人应该能够上传包含数据的 CSV 文件以显示在页面中。

这是持久数据吗？意思是，数据应该被存储还是会一直上传？

在持久化的情况下，您应该使用Meteor.method 以及从服务器到客户端的发布和订阅集合。你可以看看流星之火 todo 应用教程。

如果是 临时 数据，您可以创建一个仅限客户端的 minimongo 集合并将客户端订阅到该集合。

从 Parser 获取数据时，您必须将该内容插入或添加到本地或全局集合中。

当这样做并且有一个反应（订阅）模板到集合时，它会自动显示它的内容。

同样，您应该熟悉流星火焰 todo 教程，以了解您的需求。

希望这将指导您正确的方式。

祝你好运 汤姆