Reactjs React Uncaught ReferenceError:未定义变量

我使用一个组件2次。当它第一次调用evering时效果良好，但当我第二次调用（通过react路由器移动到不同的组件）时，我出现异常

未捕获引用错误：未定义标题样式

。在控制台中，我看到了这一行中的问题：

\u react2.default.createElement（“h2”，{style:titleStyle}，this.props.title，“：”）

我做错了什么

TitleWithAddButton.jsx（有问题的组件）

从“React”导入React；
从“反应路由器”导入{Link}
导出默认类TitleWithAddButton扩展React.Component{
render（）{
设标题样式={
宽度：“50%”
};
变量按钮={
宽度：“10%”，
浮动：“对”
};
返回(
添加
{this.props.title}：
)
}
}

CarWashPage.jsx（第一次从它调用componen）

从“React”导入React；
从“./TitleWithAddButton.jsx”导入TitleWithAddButton；
从“./carwash/AllCarWashTable.jsx”导入AllCarWashTable
导出默认类CarWashPage扩展React.Component{
render（）{
var carWashPageStyle={
paddingLeft:10，
填充右：10
}
返回(
)
}
}

AddCarWashPage.jsx（第二次从这里调用组件）

从“React”导入React；
从“/../Title.jsx”导入标题
导出默认类AddCarWashPage扩展React.Component{
render（）{
var addCarWashPage={
paddingLeft:10，
填充右：10
}
返回(
)
}
}

您想在第二次调用发生的文件

AddCarWashPage.jsx

中包含

TitleWithAddButton

，但包含了

从“/../Title.jsx”导入标题。
我认为这不是问题所在。它可能是一个不同的模块，加上这是组件内部的
ReferenceError
，这很公平。让我们看看他是怎么说的，如果猜测不正确，我会删除我的答案。等等，你实际上可能是对的，因为OP说他们在
AddCarWashPage
中称之为第二次。如果是这样的话，我会说，标记为打字错误。还要看到他的文件结构中的
AddCarWashPage.jsx
自然比
AddCarWash.jsx
深1层，后者与假定的
Title.jsx
完全在同一层/同一个包中，因此
TitleWithAddButton.jsx
。谢谢你的建议，我怎样才能将问题标记为打字错误？问题下方有一个按钮，上面写着“标记”。转到“应该关闭”，然后是“脱离主题”，最后是“禁止复制或键入”。您可以为
Title.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>
    )
}
}

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>    
    )
}
}

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>
    )
}
}