ReactJS ES6問題與導入類

在ReactJS中，我試圖做一些非常簡單的事情。我有我創建了一個類：ReactJS ES6問題與導入類

//SomeName.js 
class SomeName { 
    constructor(name){ 
     this.name = name; 
    } 
}

在我React.component我：

//Index.js 
import React from 'react' 
import SomeName from './parts/SomeName' 

class Index extends React.Component{ 

    constructor(){ 
     super(); 
     let newName = new SomeName("John Doe"); 
     this.getName = this.getName.bind(this); 
    } 

    getName(){ 
     return newName; 
    } 

    render() { 
     return (
      <div className="pages-container"> 

       Hello {this.getName} 

      </div> 
     ) 
    } 
};

但是，我堅持一個調試器在我Index.js構造，我沒有得到任何參考SomeName。我看過的每一個參考文獻都顯示了這樣做（不是在ReactJS中），而且我沒有導入我製作的組件的問題，只有當我試圖返回這個值時。我覺得我有一些非常簡單的東西，我不知道是什麼。有人能幫忙嗎？

來源

2016-01-12 doubleya

您是否導出了SomeName？ – m0meni

如果不嘗試在'class SomeName'前面加'export default' – m0meni

@ AR7我其實只是做了這個，然後回來發佈答案。那是我的問題。啊! – doubleya

1）您將newName定義爲局部變量。爲了使其在getName訪問，你應該把它分配到this：

constructor() { 
    super(); 
    this.newName = new SomeName("John Doe"); // fixed here 
    this.getName = this.getName.bind(this); 
} 

getName(){ 
    return this.newName; // and here 
}

2）你應該叫getName在render方法。否則，您將獲得該功能，而不是結果：

render() { 
    return (
     <div className="pages-container"> 

      Hello {this.getName()} //do not forget parentheses 

     </div> 
    ) 
}

來源

2016-01-12 09:59:50

ReactJS ES6問題與導入類

回答

相關問題