Question

我会尽可能清楚地解释这一点。

只是要指出我使用Meteor来构建我的应用程序。

在我的项目中，我有一个如下所示的文件结构：

/imports/both/

在这个结构中，我有各种.js文件，包含我想在我的应用程序中显示的各种数据。每个.js看起来像这样：

import { Mongo } from 'meteor/mongo';

export const George = {
  "George" : {
    "Age" : 20,
    "Gender" : "Male",
    "Height" : "6ft 3in",
    "Weight" : "12.6st"
  }
}

然后在我的应用程序的主javascript文件中，我调用了各种文件，如下所示：

import { George } from '/imports/both/george';

同样在我的javascript文件中，我有这一行：

const data = George;
console.log(data);

运行应用程序时，控制台显示以下内容：

Log of the data

这很棒，它可以按预期将数据打印到控制台。

现在这是我需要帮助的地方！

由于我希望向用户显示各种数据，因此我在应用程序中添加了一个下拉框，其中包含要显示的不同文件名。当用户单击选项时，它应显示与该选项名称关联的数据。

＆＃13;

var SelectPerson = document.getElementById('SelectPerson');

SelectPerson.onchange = function(){
  choice = SelectPerson.value;
  
  const data = choice;
  console.log(data);
  
};
SelectPerson.onchange();

＆＃13;

<select name="SelectPerson" id="SelectPerson">
  <option value="George">George</option>
  <option value="John">John</option>
  <option value="Frank">Frank</option>
  <option value="Dave">Dave</option>
</select>

＆＃13;

此代码显示了一个基本的下拉列表，每次选择一个新值时都会更新控制台 - 但是有人可以建议我如何制作它，所以选择一个下拉值会从我的导入文件夹中调用相关数据吗？

非常感谢提前

Answer 1

您可以使用Spacebars模板轻松完成此操作。您的客户端JavaScript需要这样的对象：

const data = {
   "George" : George
   "John" : John
}

然后，您可以根据此数据动态创建下拉菜单，并将其提供给您的视图，如here所述。

获取与下拉选项对应的JSON数据

1 个答案: