使用 Flowrouter 和 trackerreact 显示来自 Meteor.call 函数的数据。答案

【问题标题】：Display data from Meteor.call function with Flowrouter and trackerreact.使用 Flowrouter 和 trackerreact 显示来自 Meteor.call 函数的数据。
【发布时间】：2023-03-24 13:07:01
【问题描述】：

我有这个代码，

import React from 'react';
import ReactDOM from 'react-dom';
import { Meteor } from 'meteor/meteor';
import TrackerReact from 'meteor/ultimatejs:tracker-react';
const username = "test";
export default class TasksWrapper extends TrackerReact(React.Component){
    constructor(){
        super();
        Meteor.call('getMyInfo', (error,data)=>{
            if(error){
                alert(error);
            }else{
                this.username = data.username;
            }
        });
    }
    render(){
        return (
        <div className="container">
        <div className="row profile">
            {this.username}
        </div></div>
        )
    }
}

上面的代码行不工作。我想要的是在 div 中显示用户的用户名，类名为“行配置文件”。

当我运行这些代码时，我只得到“测试”。它显示在页面中。我要显示的是用户名。例如，“约翰”。

我该怎么做？有样品吗？

【问题讨论】：

“getMyInfo”在哪里定义？
在服务器上。我把它放在服务器文件夹/

标签： javascript reactjs meteor flow-router

【解决方案1】：

您需要将username 存储为state，以便当username 更改时，React 将重新渲染组件：

export default class TasksWrapper extends TrackerReact(React.Component) {
  constructor() {
    super();
    this.state = {
      username: ''
    };
    Meteor.call('getMyInfo', (error, data) => {
      if (error) {
        alert(error);
      } else {
        this.setState({username: data.username});
      }
    });
  }
  render() {
    return (
      <div className="container">
        <div className="row profile">
          {this.state.username}
        </div>
      </div>
    )
  }
}

【讨论】：