React Interface实例中如何引用.this？Primereact组件Props函数调用问题

你遇到的问题核心是箭头函数的this绑定规则：箭头函数不会创建自己的this，它会继承定义时所在作用域的this。在模块顶层（也就是你定义myItem的地方），严格模式下this默认是undefined，所以箭头函数里的this.label自然无法访问到对象的label属性。

下面给你几种可行的解决方案：

方案一：提前提取变量（最推荐） #

把需要用到的属性值先定义成变量，然后在action函数里直接引用这个变量，简单直接且避免this相关问题：

const itemLabel = "AwesomeName";

const myItem: Props = {
    label: itemLabel,
    style: myStyles.ordinaryItem,
    action: () => {
        someResolver.resolveSomething(itemLabel);
    }
};

方案二：使用普通函数并注意this绑定（需谨慎） #

如果必须从对象自身获取属性，可以改用普通函数，但要注意组件调用action时的this指向：

const myItem: Props = {
    label: "AwesomeName",
    style: myStyles.ordinaryItem,
    action: function() {
        // 这里的this会指向调用action时的上下文
        // 如果Primereact组件调用时会把this绑定到当前props对象，就能拿到label
        someResolver.resolveSomething(this.label);
    }
};

不过这种方式有风险：如果组件调用action时没有绑定正确的this（比如用箭头函数调用），this还是会指向undefined或者其他对象，所以更推荐第一种方案。

方案三：直接引用对象（需注意变量提升） #

如果要直接访问myItem的属性，需要先声明变量再赋值，利用变量提升的特性：

let myItem: Props;

myItem = {
    label: "AwesomeName",
    style: myStyles.ordinaryItem,
    action: () => {
        someResolver.resolveSomething(myItem.label);
    }
};

这种方式虽然可行，但如果后续myItem被重新赋值，action函数会引用最新的值，可能不符合预期，所以仅在必要时使用。

内容的提问来源于stack exchange，提问作者Nomenator