Question

我有一个执行GET请求的Meteor Helper，我应该得到回复并将其传回模板，但它现在显示前端。当我将它记录到控制台时，它会显示corerctly的值，对于我的生命，我无法将其输出到实际模板。

这是我的帮手：

<!-- [START] BottomSheet -->
<FrameLayout
    android:id="@+id/bottomSheetParent"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:fitsSystemWindows="true"
    app:behavior_hideable="false"
    app:behavior_peekHeight="0dp"
    app:layout_behavior="@string/bottom_sheet_behavior">

    <include
        android:id="@+id/bottomSheetMain"
        layout="@layout/fragment_bottom_sheet_song"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</FrameLayout>
<!-- [END BottomSheet] -->

在我的模板中，我传递了以下内容：

 UI.registerHelper('getDistance', function(formatted_address) {
HTTP.call( 'GET', 'https://maps.googleapis.com/maps/api/distancematrix/json?    units=imperial&origins=Washington,DC&destinations='+formatted_address+'&key=MYKEY', {}, function( error, response ) {
if ( error ) {
console.log( error );
} else {
var distanceMiles = response.data.rows[0].elements[0].distance.text;
console.log(response.data.rows[0].elements[0].distance.text);
return distanceMiles;
}
});
});

同样，这样可以正常工作，并在控制台中准确显示我需要的内容，但不会在模板中显示。

任何想法我做错了什么？

Answer 1

最佳做法是不要在帮助程序中执行异步调用。将#each和帮助器视为视图的一种方式，只是简单地显示先前计算的结果，而不是开始进行计算。请记住，对于单个项目，可能会多次调用帮助程序。

相反，在模板的onCreated（）中，开始获取所需数据并进行计算。将这些结果存储在反应式var或反应式数组中。那么你的助手除了查看以前计算的结果外什么都不应该做。此外，如果该助手的召唤次数超出您的预期，您不必担心所有这些额外的异步呼叫。

Answer 2

我最近在TMC上发布了article，您可能会发现这种模式很有用。在该文章中，问题涉及为列表中的每个项目执行昂贵的功能。正如其他人所指出的那样，在帮助程序中进行异步调用并不是一种好的做法。

在您的情况下，制作名为Distances.的本地收藏集。如果您愿意，可以使用文档_id将其与收藏集对齐。

const Distances = new Mongo.collection(); // only declare this on the client

然后设置一个懒惰地计算距离的函数，或者如果它已经被计算则立即返回它：

function lazyDistance(formatted_address){
  let doc = Distances.findOne({ formatted_address: formatted_address });
  if ( doc ){
    return doc.distanceMiles;
  } else {      
    let url = 'https://maps.googleapis.com/maps/api/distancematrix/json';
    url += '?units=imperial&origins=Washington,DC&key=MYKEY&destinations=';
    url += formatted_address;
    HTTP.call('GET',url,{},(error,response )=>{
      if ( error ) {
        console.log( error );
      } else {
        Distances.insert({
          formatted_address: formatted_address,
          distanceMiles: response.data.rows[0].elements[0].distance.text
        });
      }
    });
  }
});

现在您可以拥有一个只从该本地集合返回缓存值的帮助程序：

UI.registerHelper('getDistance',formatted_address=>{
  return lazyDistance(formatted_address);
});

您也可以基于_id而不是地址字符串来执行此操作。上面有一个默认的假设formatted_address是唯一的。

这是Meteor的反应性真正使这项工作成功。第一次调用辅助函数时，距离将为null，但是当它以异步方式计算时，帮助程序将自动更新该值。

Answer 3

结果未显示，因为HTTP.call是异步函数。

在你的情况下使用reactiveVar。

根据formated_address param的更新方式，您可以使用跟踪器自动运行来触发getDistance。

REGS 晏

Meteor Helper的返回值未显示在模板中

3 个答案: