javascript - 调用 React 函数不起作用

Question

我的代码如下，我希望我的结果是“Hello Mr. John Doe”。

function formatname(name) {
    return name.fullName;
};

const name = {
    firstName: 'John',
    lastName: 'Doe',
    fullName: function() {
        return this.firstName + ' ' + this.lastName;
    }
};

const getName = (
    <h1>Hello Mr. {formatname(name)}</h1>
);

ReactDOM.render(
    getName,
    document.getElementById('root')
);

但是当我保存它时返回的是“Hello Mr.”，这是我在变量 fullName 中的错误。

Answer 1

在您的代码中:

const name = {
    firstName: 'John',
    lastName: 'Doe',
    fullName: function() {
        return this.firstName + ' ' + this.lastName;
    }
};

这不再引用您的变量名。要解决，您需要将其绑定(bind)回您声明的名称:

formatname(name).bind(name)()

---

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

The bind() method creates a new function that, when called, has its this keyword set to the provided value, with a given sequence of arguments preceding any provided when the new function is called.