React Uncaught ReferenceError：variable is not defined

Question

我使用一個組件2次。當它第一次呼叫時是好的，但當我第二次呼叫時（通過反應路由器移動到不同的組件），我有例外Uncaught ReferenceError: titleStyle is not defined。在控制檯中，我看到這一行中的問題：_react2.default.createElement("h2", { style: titleStyle },this.props.title,":") 我做錯了什麼？

TitleWithAddButton.jsx（有問題的組分）

import React from 'react'; 
import {Link} from 'react-router' 

export default class TitleWithAddButton extends React.Component{ 
render(){ 
    let titleStyle = { 
     width:"50%" 
    }; 

    var button = { 
     width: "10%", 
     float: "right" 
    }; 

    return (
     <div className="title-with-add-button"> 
      <div> 
       <Link to="/carwashAdd"><button type="button" className="btn btn-success" style={button}>Add</button></Link> 
      </div> 
      <h2 style={titleStyle}>{this.props.title}:</h2> 
     </div> 
    ) 
} 
} 

CarWashPage.jsx（第一次componen是從它的呼叫）

import React from 'react'; 
import TitleWithAddButton from './TitleWithAddButton.jsx'; 
import AllCarWashTable from './carwash/AllCarWashTable.jsx' 

export default class CarWashPage extends React.Component{ 

render(){ 
    var carWashPageStyle = { 
     paddingLeft: 10, 
     paddingRight: 10 
    } 

    return (
     <div style={carWashPageStyle}> 
      <TitleWithAddButton title="All carwash"/> 
      <AllCarWashTable/> 
     </div>  
    ) 
} 
} 

AddCarWashPage.jsx（第二次組件是從這裏撥打的）

import React from 'react'; 
import Title from './../Title.jsx' 

export default class AddCarWashPage extends React.Component{ 

render(){ 
    var addCarWashPage = { 
     paddingLeft: 10, 
     paddingRight: 10 
    } 

    return (
     <div style={addCarWashPage}> 
      <Title title="Add CarWash"/> 
     </div> 
    ) 
} 
} 

Answer 1

您的意思是包含TitleWithAddButton的文件AddCarWashPage.jsx您的第二次通話發生，但包括import Title from './../Title.jsx'。