2

私は、フロールータールーティングパラメーターを介して指定されたデータをreactjsで使用する方法を見つけようとしています。

私が達成しようとしているのは、ユーザーが特定の属性を持つファームを作成し、そのデータを mongo コレクションに挿入すると、別のビューで値を更新できるということです。したがって、たとえば、この更新ビューに渡されたユーザーの _id を何らかの方法で取得する必要があります。

現在、私は次のようにこのコードを持っています:

FlowRouter.route("/serviceplan/general/basic/:postId",{

name: "BasicInformation",
action(params){
    renderTestLayout(<BasicInfo params={params}/>);
}});

ビューコード:

BasicInfo = React.createClass({

 propTypes: {

     params: React.PropTypes.object.isRequired,
 },

mixins: [ReactMeteorData],

getMeteorData(){
    return{
        owner: Farms.findOne({farmname: this.props.params.postId})

    }
},

updateFarm(){
    console.log("updated!");
},

render(){

    console.log(this.data.owner);
    console.log(this.data.owner.address);

    return( 
        <div>

            <div className="col-sm-4">
            <h1>Basic information</h1>
            <form onSubmit={this.updateFarm}>
                <label>Name:</label>
                    <input type="text" ref="fname" className="form-control" defaultValue=""/><br></br>

                <label>Address:</label>
                <input type="text" ref="address" className="form-control" defaultValue=""/><br></br>

                <label>Postalcode:</label>
                <input type="text" ref="postalcode" className="form-control" defaultValue=""/><br></br>

                <label>Area:</label>
                <input type="text" ref="municipality" className="form-control"defaultValue=""/><br></br>

                <input type="submit" value="Update" className="btn btn-default" onClick={this.updateFarm}/>
            </form>
            </div>
        </div>
    );
}

ここでの問題は、この BasicInfo コンポーネント ビューにリダイレクトされたときに、データが小道具で正常に機能することです。しかし、変更を送信しようとすると、ページがリロードされ、アプリがクラッシュします。おそらく、このコンポーネントに指定されていないため、prop 値が null であるためです。

リフレッシュするたびにURLからpostId値を取得するための解決策は何ですか?

4

1 に答える 1

0

アプリがクラッシュする原因と解決策を見つけました。

存在しないデータにアクセスしようとしていました。

if(this.data.owner){

        farmname = this.data.owner.farmname;
        address = this.data.owner.address;
        postalcode = this.data.owner.postalcode;
        municipality = this.data.owner.municipality;
        region = this.data.owner.municipality;

実際の解決策は、アクセスする前にmongoデータオブジェクトがnullでないかどうかを確認することです。

于 2016-03-03T23:37:02.223 に答える