Meteor - 何も返さないTracker.autorun関数の内部に戻ります

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 { 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); 

Answer 2

は、これが正しい答えであるかどうか分からないのですが、私は通常、これは私のために働いたこの

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} 
     ) 
     } 
    }