2016-12-31 75 views
2

在我的反應,和/流星使用react-router應用程序,我想的URL參數(例如URL:/user/P8HDQMAuapRESoWo6)通入createContainer,其獲取第一MongoDB的查詢在訪問URL參數流星反應的的createContainer

的結果
let user = Meteor.users.findOne({ _id: this.props.params.id}); 

運行第二個MongoDB的查詢

 users: Meteor.users.find(
      { 
       'location': { 
        $near: { 
         $geometry: { 
          'type': 'Point', 
          'coordinates': user.location.coordinates 
     ... 

然而,這導致錯誤

Uncaught TypeError: Cannot read property 'params' of undefined 
  1. 我們如何訪問URL參數或this.props.params
  2. 我們應該在createContainer裏面運行第一個Mongodb查詢Meteor.users.findOne()嗎?

User.jsx

import React, { Component, PropTypes } from 'react'; 
import { createContainer } from 'meteor/react-meteor-data'; 

export class User extends Component { 
    constructor(props) { 
     super(props); 
    } 

    render() { 
     return (
      <div> 
       Something 
      </div> 
     ) 
    } 
} 


export default createContainer(() => { 
    Meteor.subscribe('allUsers') 

    let user = Meteor.users.findOne({ _id: this.props.params.id}); 

    return { 
     users: Meteor.users.find(
      { 
       'location': { 
        $near: { 
         $geometry: { 
          'type': 'Point', 
          'coordinates': user.location.coordinates 
         }, 
         $maxDistance: 400 
        } 
       } 
      } 
     ).fetch() 
    } 
}, User); 

它是確定包裹reuturn功能也是這樣嗎?

export default createContainer(({params}) => { 
Meteor.subscribe('allUsers') 

    let user = Meteor.users.findOne({ _id: params.id}); 

    if(user) { 
     return { 
      users: Meteor.users.find(
       { 
        'location': { 
         $near: { 
          $geometry: { 
           'type': 'Point', 
           'coordinates': user.location.coordinates 
          }, 
          $maxDistance: 400 
         } 
        } 
       } 
      ).fetch() 
     } 
    } else { 
     return { users: [] } 
    } 
}, User); 

回答

4

createContainer接受來自反應路由器(或任何父)作爲函數參數的道具。這應該工作:

export default createContainer(({params}) => { 
Meteor.subscribe('allUsers') 

    let user = Meteor.users.findOne({ _id: params.id}); 

    return { 
     users: Meteor.users.find(
      { 
       'location': { 
        $near: { 
         $geometry: { 
          'type': 'Point', 
          'coordinates': user.location.coordinates 
         }, 
         $maxDistance: 400 
        } 
       } 
      } 
     ).fetch() 
    } 
}, User); 
+0

感謝它的工作。我還通過在'if ... else'語句中添加對代碼的修改來更新問題,所以如果mongodb查詢還沒有準備好,'createContainer'會將空的道具傳遞給'User'組件。這可以嗎?代碼的作品,但我不知道這是否是常見做法 – Nyxynyx

+0

是的,這似乎是一個很好的方法 –