React Native中Redux动态绑定函数属性不执行问题求助

嗨，我一眼就看到问题所在啦——你把函数用模板字符串包起来了，导致onBtn1Press变成了字符串而不是可调用的函数引用，点击按钮时自然会报错“不是函数”。

问题根源 #

你这段代码里的模板字符串是罪魁祸首：

opts['onBtn1Press'] = `${ () => this.addToTest() }`;

模板字符串会把箭头函数强制转换成字符串格式（就像你打印出来的"function () { return _this4.addToTest(); }"），但字符串显然不是可执行的函数，所以TouchableOpacity触发onPress时，调用一个字符串肯定会失败。

修复方案 #

直接去掉模板字符串的包裹，把函数直接赋值给onBtn1Press即可，不需要转成字符串。修改后的代码如下：

const state = appStore.getState();
let opts = {};
if(state.bottomBar.tabName === 'TEST') {
  opts['btn1'] = this.btnText(); // 文本也不需要模板字符串，直接返回值就行
  opts['onBtn1Press'] = () => this.addToTest(); // 直接赋值箭头函数引用
} else {
  opts['btn1'] = 'Testing';
  opts['onBtn1Press'] = () => this.doSomething(); // 同样直接赋值函数
}

这样打印opts时，onBtn1Press就会显示为ƒ () { return _this4.addToTest(); }（函数类型），而非字符串，点击按钮时就能正确执行对应的方法了。

额外优化建议 #

你还可以用条件表达式简化代码，让结构更清晰：

const state = appStore.getState();
const isTestTab = state.bottomBar.tabName === 'TEST';
const opts = {
  btn1: isTestTab ? this.btnText() : 'Testing',
  onBtn1Press: isTestTab ? () => this.addToTest() : () => this.doSomething()
};

另外，如果你的addToTest和doSomething方法内部没有依赖组件的this上下文，或者已经在构造函数里绑定过this，甚至可以直接传递函数本身：

onBtn1Press: isTestTab ? this.addToTest : this.doSomething

这样写法更简洁，但要确保函数的this指向正确哦～

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