react 中随state状态改变，数据在dom中渲染问题

    初遇react，问题不断，react生命周期变化，会随着setState状态改变，昨天遇到个问题，处理到晚上10点，虽然自己琢磨未果，但是对生命周期有了很大的了解；

后续再补充相关知识，先说需求：

想获取对象嵌套对象中的某个属性，把值写入render中，渲染dom

1.

2.请求到json中图片，title ，描述  

操作如下：

componentDidMount: function () {    var _this = this,        state=_this.state;    Core.get({        noDomain: true,        dataType: 'jsonp',        jsonpCallback:'callback',        port: DOMAINNAME + '/v2/goods/GetGoodsDetail?access-token=' + '279a602ab4ca4d84bbc13a6ca9a714c8',        data: {            brandCode:brandCode,            goodsType:1        },        callback: function (json) {            if (json && json.code == 1) {                var proList = state.proList,                    goods = json.data.goods,                    spec = this.state.spec;                for(var key in goods){                    spec.push(goods[key]);                }                _this.setState({                    loading: false,                    goodsTitle: json.data.goodsTitle,                    banners: json.data.goodsImg,                    // tags: json.data.tags,                    goods: json.data.goods,                    spec:spec                    /*banners: [                        "http://www.duocaitou.com/assets/h5/build/img/integral/[e-mail]","http://www.duocaitou.com/assets/h5/build/img/integral/[e-mail]"                    ]*/                });                            }

render中的

render: function () {    var tags = this.state.tags,        goods = this.state.goods,        spec = this.state.spec;    /*for(var key in goods){        var spec = goods[key];        for(var x in spec){            spec[x];        }    }*/    // console.log(spec[0]);    // console.log(spec.imagePath);       /* for (var i in goods) {            spec.push(goods[1]);            for(var j in spec){                var imagePath1 = spec[j].imagePath;            }        }        for (var i in goods[2]) {            spec.push(goods[2]);            for(var j in spec){                var imagePath2 = spec[j].imagePath;            }        }*/    return (        <section className="hotel-detail-wrap">            <div className="top">                <div className="goback" onTouchEnd={this.back}>                    <span className="back"></span>                </div>                <div className="swiper-container" id="J_detailPics">                    <div className="swiper-pagination ks_ts">                        <div className="hotel-warp">                            <img src="build/img/integral/[e-mail]" alt=""/>                        </div>                        <div className="hotel-warp">                            <img src="build/img/integral/[e-mail]" alt=""/>                        </div>                        <div className="hotel-warp">                            <img src="build/img/integral/[e-mail]" alt=""/>                        </div>                        <div className="hotel-warp">                            <img src="build/img/integral/[e-mail]" alt=""/>                        </div>                        <div className="hotel-warp">                            <img src="build/img/integral/[e-mail]" alt=""/>                        </div>                        {/*{                            <Slider type="slider" photos={this.state.banners} />                        }*/}                    </div>                    <ul className="hotel-wt">                        <li className="hotel-wt2"></li>                        <li></li>                        <li></li>                        <li></li>                        <li></li>                    </ul>                </div>            </div>            <div className="detail-info mar_b20">                <div className="title">                    {this.state.goodsTitle}                </div>                <div className="detail-tags">                    <ul>                        {                            tags.map(function(tag){                                return <li className="title_tag">{tag}</li>                            })                        }                    </ul>                </div>            </div>            <div className="h20"></div>            <div className="products clearfix">                <div className="goods-img">                    <a href="">

//spec会随着state状态变化，spec打印两次，判断当有值时候，放入链接

                        <img src={spec[0] ? spec[0].imagePath : null} alt=""/>                    </a>                </div>                <div className="goods-about">                    <p className="title">豪华双床房</p>                    <p className="description">建筑面积：43m;楼层:1-2楼;床型：双人床2米；可入住：2人</p>                    <p className="sumPoint">26000<span>积分/晚</span></p>                    <a href="editOrder.html" className="recharge-btn">                        <span>立即兑换</span>                    </a>                </div>            </div>            <div className="h20"></div>            <div className="products clearfix">                <div className="goods-img">                    <a href="">                        <img src="build/img/integral/[e-mail]" alt=""/>                    </a>                </div>                <div className="goods-about">                    <p className="title">豪华双床房</p>                    <p className="description">筑面积：43m;楼层:1-2楼;床型：双人床2米；可入住：2人</p>                    <p className="sumPoint">26000<span>积分/晚</span></p>                    <a href="editOrder.html" className="recharge-btn">                        <span>立即兑换</span>                    </a>                </div>            </div>        </section>    );}