React-Native-Navigation（Vix）如何正确设置组件样式

Question

我是本机vix导航的新手。我正在缓慢地构建屏幕，并且试图了解如何正确设置组件的样式？我无法理解我在注册应用程序时是否应该通过索引对场景进行样式设置，还是应该对其中的组件进行样式设置？这是正确的，因为我计划为每个场景使用不同的标题部分，并使用不同的文本，按钮等。

在我的index.js中：

import { Navigation } from "react-native-navigation";
import App from './App';

import Welcome from './src/Screens/Welcome';
import Screen2 from "./src/Screens/Screen2";

Navigation.registerComponent(`WelcomeScreen`, () => Welcome);
Navigation.registerComponent(`Screen2`, () => Screen2);

Navigation.events().registerAppLaunchedListener(() => {
  Navigation.setRoot({
        root: {
         stack:{
             id: 'AppStack',
             children: [
                 {
                     component:{
                         name: 'WelcomeScreen',
                         options:{
                             topBar: {
                                 rightButtons: [
                                     {
                                         id: 'birr',
                                         icon: require('./images/bag.png')
                                     }

                                 ],
                                 title: {
                                     text: 'My Screen',
                                     color: 'red',
                                     alignment: 'center'
                                 },
                                 visible: true
                             }
                         }
                     },

                 },
             ]
         },
        }
  });
});

相反，我应该在组件内部这样做吗？

export default class Welcome extends Component<Props> {
    constructor(props){
            super(props);
            Navigation.events().bindComponent(this);

            this.state = {
                text: 'Alo'
            }

        }

        componentDidAppear() {
            this.setState({ text: 'componentDidAppear' });

            Navigation.mergeOptions(this.props.componentId, {
                topBar: {
                    rightButtons: [
                        {
                            id: 'birr',
                            icon: require('../../images/bag.png')
                        },

                    ],
                    title: {
                        text: 'My Screen',
                        color: 'red',
                        alignment: 'center'
                    },
                    visible: true
                }
            });
        }
}