Javascript 在react组件中，不以静态或经典方式查看函数

我已经在这个组件中编写了这个函数 但它不会改变任何看起来像看不到的功能 从“React”导入React

export default React.createClass({
    var arrNum=[15,16,35,36,37,38,39,40];
      var check=function(imgURL){
      var newUrl="";
      var imgNum=imgURL.slice(45,47)
      imgNum=Number(imgNum)
        for(var i=0;i < arrNum.length; i++){
            if(imgNum === arrNum[i]){
              newUrl=imgURL;
              newUrl=newUrl.replace(imgNum,imgNum+"_en");
              return newUrl
            }
          }
              return imgURL
      }
  render() {

    return <div>
     <div className="main">
          <img className="img1" src=check({this.props.img1})/>
          <img className="img2" src=check({this.props.img2})/>
          <img className="img3" src=check({this.props.img3})/>
          <img className="img4" src=check({this.props.img4})/>

     </div> 
   </div>
  }
})

export default React.createClass({
var arrNum=[15,16,35,36,37,38,39,40]；
var检查=功能（imgURL）{
var newUrl=“”；
var imgNum=imgURL.slice（45,47）
imgNum=数量（imgNum）
对于（变量i=0；i

---

如何使此函数在react中工作？

尝试将逻辑放在

呈现

中，但在

返回之前

例如：

export default React.createClass({

  render() {
     var arrNum=[15,16,35,36,37,38,39,40];
      var check=function(imgURL){
      var newUrl="";
      var imgNum=imgURL.slice(45,47)
      imgNum=Number(imgNum)
        for(var i=0;i < arrNum.length; i++){
            if(imgNum === arrNum[i]){
              newUrl=imgURL;
              newUrl=newUrl.replace(imgNum,imgNum+"_en");
              return newUrl
            }
          }
              return imgURL
      }

    return (
      <div>
        <div className="main">
          <img className="img1" src=check({this.props.img1})/>
          <img className="img2" src=check({this.props.img2})/>
          <img className="img3" src=check({this.props.img3})/>
          <img className="img4" src=check({this.props.img4})/>

        </div> 
      </div>
    )  
  }
})

export default React.createClass({
render（）{
var arrNum=[15,16,35,36,37,38,39,40]；
var检查=功能（imgURL）{
var newUrl=“”；
var imgNum=imgURL.slice（45,47）
imgNum=数量（imgNum）
对于（变量i=0；i

ReactClass

签名为：

 ReactClass({
  functionName1 : functionItself1, 
  functionName3 : functionItself2, 
//....
  render : functionRenderItself,   
});

<> p>所以可以考虑<代码>检查<代码>函数，作为<代码>函数1>代码>：

 ReactClass({
  check :/*...*/, 
  render : functionRenderItself,   
});

然后，要从

render

访问

check

，必须在它前面加上

this.

<img className="img1" src={this.check({this.props.img1)} />

结果:

const arrNum=[15,16,35,36,37,38,39,40]；
导出默认的React.createClass({
检查：功能（imgURL）{
var newUrl=“”；
var imgNum=imgURL.slice（45,47）
imgNum=数量（imgNum）
对于（变量i=0；i

您是否相信您的代码可以重构为：

const arrNum = [15, 16, 35, 36, 37, 38, 39, 40];

export default React.createClass({
  check: function(imgURL) {
    const imgNum = Number(imgURL.slice(45, 47));
    imgNum = arrNum.find((item) => item === imgNum);
    return (!imgNum) ? imgURL : imgURL.replace(imgNum, imgNum + "_en");
  },
  range: function(length) {
    return Array.from({length}, (v, k) => k + 1);
  },
  render: function() {
     return (
       <div>
        <div className="main">
         {
           this.range(4).map(i => <img className={"img"+ i} src={this.check(this.props["img"+i])} />)
         }
        </div>
       </div>
     );
  }
})

const arrNum=[15,16,35,36,37,38,39,40]；
导出默认的React.createClass({
检查：功能（imgURL）{
常量imgNum=数字（imgURL.slice（45,47））；
imgNum=arrNum.find（（项）=>item==imgNum）；
返回（！imgNum）？imgURL:imgURL.replace（imgNum，imgNum+“en”）；
},
范围：功能（长度）{
返回数组。from（{length}，（v，k）=>k+1）；
},
render:function（）{
返回(
{
这个.range（4.map）（i=>）
}
);
}
})

我从'React'const arrNum=[15,16,35,36,37,38,39,40]导入React；导出默认的React.createClass（{check:function（imgURL）{var newUrl=“”；var imgNum=imgURL.slice（45,47）imgNum=Number（imgNum）for（var i=0；iconst arrNum = [15, 16, 35, 36, 37, 38, 39, 40]; export default React.createClass({ check: function(imgURL) { const imgNum = Number(imgURL.slice(45, 47)); imgNum = arrNum.find((item) => item === imgNum); return (!imgNum) ? imgURL : imgURL.replace(imgNum, imgNum + "_en"); }, range: function(length) { return Array.from({length}, (v, k) => k + 1); }, render: function() { return ( <div> <div className="main"> { this.range(4).map(i => <img className={"img"+ i} src={this.check(this.props["img"+i])} />) } </div> </div> ); } })