Question

在关注流星网站上的入门教程后，我停止了“2.4创建应用程序组件”项目，并在安装后开始了我的应用程序：

meteor add http

应用目的是以不同的方式可视化纽约州的彩票api数据。在/server/main.js

import { Meteor } from 'meteor/meteor';
import { HTTP } from 'meteor/http';

var apiUrl = 'https://data.ny.gov/api/views/dg63-4siq/rows.json';

Meteor.methods({
  get_data : function() {
    console.log('Getting data');
    var data = Meteor.http.call("GET", apiUrl).data.data.slice(-50);
    console.log(data);
    console.log('Done');
    return data;
  }
})

Meteor.startup(() => {

});

而我的App.jsx看起来像这样

import React, { Component } from 'react';
import { Meteor } from 'meteor/meteor';

// App component - represents the whole app
Meteor.call('get_data', function(err, res){
  if(err){
    console.log('ERROR @ CALL');
  } else {
    // console.table(res);
    console.log('Server responding...');
    console.log(res);
    return res;
  }
});

export default class App extends Component {}

此代码在客户端控制台上返回一个50个数组的对象

(50) [Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11), Array(11)]0: Array(11)1: Array(11)2: Array(11)3: Array(11)4: Array(11)5: Array(11)6: Array(11)7: Array(11)8: Array(11)9: Array(11)10: Array(11)11: Array(11)12: Array(11)13: Array(11)14: Array(11)15: Array(11)16: Array(11)17: Array(11)18: Array(11)19: Array(11)20: Array(11)21: Array(11)22: Array(11)23: Array(11)24: Array(11)25: Array(11)26: Array(11)27: Array(11)28: Array(11)29: Array(11)30: Array(11)31: Array(11)32: Array(11)33: Array(11)34: Array(11)35: Array(11)36: Array(11)37: Array(11)38: Array(11)39: Array(11)40: Array(11)41: Array(11)42: Array(11)43: Array(11)44: Array(11)45: Array(11)46: Array(11)47: Array(11)48: Array(11)49: Array(11)length: 50__proto__: Array(0)

每个对象具有相同的结构。

[ 8070, "FEAB37FD-8776-4056-BF6F-0D3524A42214", 8070, 1495620022, "708543", 1495620022, "708543", null, "2017-05-23T00:00:00", "03 12 25 27 35", null ]

如何将对日期和中奖号码的render（）方法的响应翻译？

Answer 1

您为App.jsx提供的代码是您使用的真实代码吗？这意味着你的课堂是空的，这很奇怪。

电话应该在课堂上：

export default class App extends Component {
  renderResults() {
    Meteor.call('get_data', function(err, res){
    if(err){
      console.log('ERROR @ CALL');
    } else {
      return res.map((result, index) => <li key={index}>{`${result[8]} - ${result[9]}`}</li>)
    }
  });
  }

  render() {
    <div>
      <ul>
        {this.renderResults()}
      </ul>
    </div>
  }
}

修改

您可以在此处阅读有关使用React数组的更多信息： https://facebook.github.io/react/docs/lists-and-keys.html

在开始第一个真正的项目之前，你应该明确地完成整个Meteor教程并阅读React文档。 ;）

渲染方法，反应流星

1 个答案: