react 传递json里面的函数给子组件

问题遇到的现象和发生背景

想把json里面的函数遍历然后传给子组件

用代码块功能插入代码,请勿粘贴截图

JS代码如下:

var json = [
{
        icon: "icon-banquan1",
        title: "清除缓存",
        onEvent:()=>{
          Taro.clearStorage();
          console.log("清除缓存");
        }
      },
{
        icon: "icon-banquan1",
        title: "清除缓存",
        onEvent:()=>{
          Taro.clearStorage();
          console.log("清除缓存");
        }
      }
]

View代码如下:

list.map((item, index) => (
              <TMCell icon={item.icon} title={item.title} key={index} onClickEvent={item.onEvent} />

            ))

运行结果及报错内容

子组件获取到为

img

我的解答思路和尝试过的方法

通过list.map 循环过后子组件拿不到方法,不通过循环 直接调用的话可以拿到方法
以下情况就可以拿到方法

onEvent(){
Taro.clearStorage();
          console.log("清除缓存");
}
var json = [
{
        icon: "icon-banquan1",
        title: "清除缓存",
        onEvent:()=>{
          Taro.clearStorage();
          console.log("清除缓存");
        }
      },
{
        icon: "icon-banquan1",
        title: "清除缓存",
        onEvent:()=>{
          Taro.clearStorage();
          console.log("清除缓存");
        }
      }
]
list.map((item, index) => (
              <TMCell icon={item.icon} title={item.title} key={index} onClickEvent={this.state.onEvent} />

            ))