如何在React Navigation中自定义header-right元素？报错求助

你定义的按钮组件没问题，但在配置导航栏右侧按钮时犯了一个小错误：

:header-right对应的回调函数里，你返回的是组件函数create-task-button本身，而不是调用这个函数生成的React元素。React无法直接渲染函数对象，因此抛出了这个警告。

只需要修改header-right的回调，给create-task-button加上括号调用它，修正后的代码如下：

(defn app-component []
  [(rnn/create-navigation-container-reload
    [stack/stack
     [{:name      :home
       :component home-comp
       :options   {:title        "Home"
                   :header-right (fn [] (create-task-button))}}
      {:name      :create-task
       :component create-task-comp
       :options   {:title "Create Task"}}]])])

这样回调函数会返回按钮的实际React元素，警告就会消失，按钮也能正常渲染在导航栏右侧。

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