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'。