materliu / gallery-by-react

one photo gallery project based on react.
MIT License
559 stars 171 forks source link

VM2441:69Uncaught TypeError: _react2.default.findDOMNode is not a function #4

Closed ShootToThrill closed 3 years ago

ShootToThrill commented 8 years ago

require('normalize.css/normalize.css'); require('styles/App.css'); import React from 'react';

// let yeomanImage = require('../images/yeoman.png'); var imageDatas = require('../data/imageDatas.json') // 图片信息转成图片路径信息 imageDatas = (function(imageDatasArr) { for (var i = 0; i < imageDatasArr.length; i++) { var singeImageData = imageDatasArr[i]; singeImageData.imageURL = require('../images/'+singeImageData.filename); singeImageData.key = require('../images/'+singeImageData.filename); imageDatasArr[i] = singeImageData; } return imageDatasArr })(imageDatas); var ImgFigure = React.createClass({ render() { return (

{this.props.data.title}/

{this.props.data.title}

    );
}

}); var AppComponent = React.createClass({ Canstant: { centerPos:{ left:0, top:0 }, hPosRange:{ leftSecX:[0,0], rightSecX:[0,0], y:[0,0] }, vPosRange:{ x:[0,0], topY:[0,0] } }, componentDidMount:function() { var stageDom = React.findDOMNode(this.refs.stage), stageW = stageDom.scrollWidth, stageH = stageDom.scrollHeight, halfStageW = Math.ceil(stageW/2), halfStageH = Math.ceil(stageH/2); var imgFigureDom = React.findDOMNode(this.refs.imgFigure0), imgW = imgFigureDom.scrollWidth, imgH = imgFigureDom.scrollHeight, halfImgW = Math.ceil(imgW/2), halfImgH = Math.ceil(imgH/2); this.Canstant.centerPos = { left:halfStageW-halfImgW, top:halfStageH-halfImgH } this.Canstant.hPosRange.leftSecX[0] = -halfImgW; this.Canstant.hPosRange.leftSecX[1] = halfStageW - halfImgW_3; this.Canstant.hPosRange.rightSecX[0] = halfStageW - halfImgW; this.Canstant.hPosRange.rightSecX[1] = stageW - halfImgW; this.Canstant.hPosRange.y[0] = - halfImgH; this.Canstant.hPosRange.y[1] = stageH - halfImgH; this.Canstant.vPosRange.topY[0] = -halfImgH; this.Canstant.vPosRange.topY[1] = halfStageH - halfImgH_3; this.Canstant.vPosRange.x[0] = halfImgW - imgW; this.Canstant.vPosRange.x[1] = halfImgW; }, render:function() { var controllerUnits = [], imgFigures = []; imageDatas.forEach(function(value,index) { imgFigures.push(<ImgFigure data={value} key={'imgFigure'+index} ref={'imgFigure'+index}/>) }); return (

{imgFigures}
    );
}

});

AppComponent.defaultProps = { };

export default AppComponent;

ShootToThrill commented 8 years ago

看得有点抓狂,那个generator现在的版本跟您的版本不一样,生成的目录文件完全不一样,连grunt都没有,跟着视频边看边写,几分钟出一次错,出问题完全靠猜,这个错我猜了至少一个小时,好歹没报错了,所以您能写个什么文档说下现在这个版本生成的目录文件跟之前那个有什么区别吗,真的,我看了一晚上视频没看几分钟代码没写多少全去搜这些问题了

lucien925 commented 8 years ago

老师使用的是react 0.13的版本 之后的比如说0.14和最新的15版react还是变化有点多的 ,大家还是自己回去好好看看吧。

ChrisyehGone commented 8 years ago

前端更新太快,需要修改代码适应最新版本的react 请参考我修改后的:https://github.com/ChrisyehGone/gallery-by-react 如果环境搭建有问题,请参考我的博客:http://blog.csdn.net/xia4o/article/details/51719979