React:将对象显示为工作JS格式?

时间:2016-10-21 10:30:34

标签: javascript json object reactjs reactjs-flux

我正在开展一个项目,在这个项目中我会遇到特定情况:

myjson:
{
    completeName: "my name is {this.state.myName+ " "+this.state.surname}"
}

component.js

var Component = React.createClass({ 
    getInitialState: function() {
        return({
            myName: "AKHA",
            surname: "HUND"
        })
    },
    render: function() {
        return (
            <div>{myData.completeName}</div>
        )
    }
})

但我的输出为:

my name is {this.state.myName+ " "+this.state.surname}

而不是:

my name is AKHA HUND***

请帮帮我。

注意:使用ES5。

由于

1 个答案:

答案 0 :(得分:2)

您在.json中存储的是字符串,而不是表达式,不会以任何方式进行评估,您必须修改JS代码中的模板。

使用ES5你可以这样做:

<强>上传.json

{
  completeName: "my name is %myName %surname"
}

<强> component.js

var Component= React.createClass({
    getInitialState: function(){
        return({
            myName: "AKHA",
            surname: "HUND"
        })
    },
    render: function(){
        const result = myData.completeName
            .replace("%myName", this.state.myName)
            .replace("%surname", this.state.surname);

        return (
            <div>{ result }</div>
        )
    }
})