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

Question

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

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

尽管模板和构建是在 Meteor 中进行的，但这还是一个普通的 JavaScript 问题。

这是我的一个非常简单的问题:如何将事件对象放入模板中？我从 Papa.parse() 函数中获得了 event 对象，并且可以 console.log(it)。但是，如何将事件对象传递到模板。

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

查看您的项目会清楚地表明这件作品还没有准备好。你的问题不是关于事件的，而是关于 meteor 的。缺少必需品。

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

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

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

如果是持久性的，您应该使用Meteor.method以及从服务器到客户端的发布和订阅集合。您可以查看 meteor 火焰待办事项应用程序教程。

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

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

执行此操作并为集合添加响应式(Reactive)(订阅)模板时，它将自动显示其内容。

同样，您应该熟悉 meteor 火焰待办事项教程，以了解您的需求。

希望这能引导您走上正确的道路。

祝你好运 汤姆