Question

函数renderNotes()应该返回一个单独文件中的映射数组。我注意到当我返回一些JSX时，没有任何东西返回到屏幕。我想我知道原因是因为它将信息返回到跟踪器功能。如何在tracker.autorun（）函数内部获取返回renderNotes()函数的信息？

import { Meteor } from "meteor/meteor";
import React from "react";
import { withRouter, Link } from "react-router-dom";
import { Accounts } from "meteor/accounts-base";
import { Tracker } from "meteor/tracker";

import SubjectRoutes from "./subjectRoutes/subjectRoutes";
import { Notes } from "../methods/methods"
import Menu from "./Menu.js";

class Home extends React.Component{
  componentWillMount() {
    if(!Meteor.userId()){
      this.props.history.replace("/login")
    }
  }
  logoutUser(e){
    e.preventDefault()
    Accounts.logout(() => {
      this.props.history.push("/login");
    });
  }
  renderNotes(){
    Tracker.autorun(function () {
      Meteor.subscribe('notes');
      let notes = Notes.find().fetch();
      // return notes.map((note) => {
      //   return <p>{note.imageURL}</p>
      // })
      return <p>asdas</p> //<--Here
    });
  }
  render(){
    return (
      <div>
        <button onClick={this.logoutUser.bind(this)}>Logout</button>
        {this.renderNotes()}
        <Menu />
      </div>
    )
  }
}

export default withRouter(Home);

Answer 1

不知道这是否是一个正确的答案，但我喜欢通常做这样的事情

    import TrackerReact from 'meteor/ultimatejs:tracker-react';
    import { Notes } from "../methods/methods";

    export default class Home extends TrackerReact(React.Component) {
        constructor(props,) {
        super(props);
        this.state = {
         subscription:{
          publishNotes: Meteor.subscribe("publish-Notes")
         }
        };
       }
       returnNotes(){
         return Notes.find().fetch();
       }

       render(){
       ...

       const stuff = this.returnNotes().map((note)=>{
        return <p>{note}</p>
       });

       return (
       ....
       {stuff}
       )
       }
    }

Answer 2

这对我有用：

import { Meteor } from "meteor/meteor";
import React from "react";
import { withRouter, Link } from "react-router-dom";
import { Accounts } from "meteor/accounts-base";
import { Tracker } from "meteor/tracker";

import SubjectRoutes from "./subjectRoutes/subjectRoutes";
import { Notes } from "../methods/methods"
import Menu from "./Menu.js";

class Home extends React.Component{
  constructor(props){
    super(props)
    this.state = {
      notes: []
    }
  }
  componentWillMount() {
    if(!Meteor.userId()){
      this.props.history.replace("/login")
    }
    this.tracker = Tracker.autorun(()=>{
      Meteor.subscribe('notes');
      let notes = Notes.find().fetch();
      this.setState({ notes })
    });
  }
  componentWillUnmount() {
    this.tracker.stop();
  }
  logoutUser(e){
    e.preventDefault()
    Accounts.logout(() => {
      this.props.history.push("/login");
    });
  }
  renderNotes(notes){
    return notes.map((note) => {
      return (
        <div key={note._id}>
          <img src={note.imageURL} />
          <p>{note.type}</p>
        </div>
      )
    });
  }
  render(){
    return (
      <div>
        <button onClick={this.logoutUser.bind(this)}>Logout</button>
        <Menu />
        {this.renderNotes(this.state.notes)}
      </div>
    )
  }
}

export default withRouter(Home);

流星 - 返回Tracker.autorun函数内部没有返回任何内容

2 个答案: