React-native-router-flux: Dynamischer Titel

Ich habe gerade Unterstützung zum Festlegen von Eigenschaften ohne Navigator-Übergang mit Actions.refresh(props) hinzugefügt. Bitte versuchen Sie es (Version 2.3.1)

Danke Aksonow.
Vielleicht verstehe ich dich nicht richtig.
Also zum Beispiel, wenn ich den Status des Titels ändern wollte. ich würde anrufen
Actions.refresh({title: 'Some other title'})
Vielen Dank, dass Sie sich bei mir gemeldet haben.
:0)

Mein Fehler, es funktioniert alles super. Vielen Dank für Ihre Hilfe aksonov. Sehr geschätzt. :0)

Ich stoße auf ein Problem, das hier wie ein Fehler beim dynamischen Einstellen des Titels aussieht. Es scheint, als ob Actions.refresh es für alle Routen festlegt und ihre statischen Titel überschreibt.

In meinem Fall habe ich ein Master-Detail-Setup, bei dem die Masterroute eine Titeleigenschaft hat und der Detailroutentitel nur dynamisch festgelegt wird. Wenn ich in der Detailroute bin und sich der Titel ändert, ändert sich sowohl der Titel als auch der Zurück-Button in den gleichen Text. Beim Zurückkehren zum Master bleibt der dynamische Titel erhalten (anstatt zum Schematitel zurückzukehren).

Ich bin neu bei React Native, also bin ich mir nicht sicher, ob dies beabsichtigt ist oder nicht...?

Danke!

Gibt es eine Möglichkeit, es für eine bestimmte Szene einzustellen, auch wenn ich mich gerade nicht in dieser Szene befinde? dh

Actions.refresh({key: 'home', title: 'My new title'})

@greatwitenorth was ist dein genauer Anwendungsfall?
Wenn Sie zB mit der Taste view2 zu einer Ansicht navigieren, können Sie den Titel mit den Requisiten wie folgt festlegen

Actions.view2({ title: 'My New Title' })

Mein Problem war, dass ich nicht zu der Szene navigierte, deren Titel aktualisiert werden musste. Mein Bildschirm hat die Adresse des Benutzers aktualisiert, aber die Adresse wurde als Titel auf einem völlig separaten Bildschirm angezeigt.

@greatwitenorth Ich bin auf das gleiche Problem

OK, ich hätte die Dokumentation besser lesen sollen, es ist einfach
Actions.refresh({title: 'new title'})

@greatwitenorth hast du eine anständige Lösung gefunden?
Ich rufe den Titel aus dem Status ab. Wenn sich der Status ändert, möchte ich, dass eine bestimmte Ansicht diesen Wert als Titel hat. Manchmal ändern Leute den Titel und navigieren über die Zurück-Schaltfläche. In diesem Fall kann ich den Parameter {title: } anscheinend nicht definieren (und den Zustandswert in der Zurück-Aktion übergeben), oder übersehe ich etwas?

Das Aktualisieren in einer der Lebenszyklusmethoden der Komponente (oder beim Rendern) führt zum Absturz der App, da sie wahrscheinlich aufgrund sich ändernder Zustandseigenschaften in eine Endlosschleife gerät.

Mit freundlichen Grüße,

@JeroenNelen Ich hatte ein ähnliches Problem und habe es gelöst, indem ich die Aktualisierung in ComponentDidMount platziert und den Status in Redux-Reduzierern festgelegt habe - ich binde eine Redux-Aktion in jede Benutzeraktion ein, die den Titel ändert, den App-Status aktualisiert und die Requisiten, die die Aktualisierung liest, aktualisieren auch.

Also im Grunde so etwas wie diese Zeile in ComponentDidMount:

Actions.refresh({title: this.props.state.myapp.myvalue})

@jondbm danke für den Vorschlag, aber wir haben uns entschieden, zu einem anderen Navigator zu wechseln.

Mit freundlichen Grüße,

@JeroenNelen welchen Navigator verwendest du gerade? (Wenn es Ihnen nichts ausmacht zu teilen)

Warum aktualisiert das unten stehende Setup die rechte Schaltfläche nicht? console.log schreibt den neuen Wert, aber der richtige Titel wird nie aktualisiert?

const RouterWithRedux = connect()(Router);

export class App extends Component {

  constructor(props) {
    super(props);
  }

  render() {
    let title = '(' + this.props.basket.length + ')';
    console.log(title);
    return (
      <RouterWithRedux rightTitle={title} onRight={() => alert('All right')}>
        <Scene key="root">
          <Scene key="home" component={Main} title="Main"/>
          <Scene key="page1" component={SomePage} title="SomePage"/>
        </Scene>
      </RouterWithRedux>
    );
  }
}
App.propTypes = {
  dispatch: PropTypes.func.isRequired
};

// Wrap the component to inject dispatch and state into it
export default connect(
  state => {
    return {basket: state.basket.items}
  }
)(App);

@jaynakus richtiger Titel oder rechter Knopf?

Der Titel!

Ich würde vorschlagen, eine benutzerdefinierte Navbar zu verwenden, mit allem, was Sie darin haben möchten.

@jaynakus Versuchen Sie, Ihren rightTitle und onRight in Ihre Scene-Komponente zu setzen, anstatt auf der obersten RouterWithRedux-Ebene, das könnte funktionieren.

@jondbm , sie in die Root-Szene zu setzen, wurde nicht gelöst, aber das Aufrufen von Actions.refresh() in componentWillReceiveProps hat den Zweck erfüllt;)

const RouterWithRedux = connect()(Router);

export class App extends Component {

  constructor(props) {
    super(props);
  }

  componentWillReceiveProps(nextProps) {
    if (this.props.basket.length !== nextProps.basket.length) {
      console.log(nextProps.basket.length);
      let title = '(' + nextProps.basket.length + ')';
      Actions.refresh({rightTitle: title});
    }
  }

  render() {
    let title = '(' + this.props.basket.length + ')';
    return (
      <RouterWithRedux>
        <Scene key="root" rightTitle={title} onRight={() => alert('All right')}>
          <Scene key="home" component={Main} title="Main"/>
          <Scene key="page1" component={SomePage} title="SomePage"/>
        </Scene>
      </RouterWithRedux>
    );
  }
}
App.propTypes = {
  dispatch: PropTypes.func.isRequired
};

// Wrap the component to inject dispatch and state into it
export default connect(
  state => {
    return {basket: state.basket.items}
  }
)(App);

schau hier: https://github.com/aksonov/react-native-router-flux/issues/1922

Das ist großartig, gibt es eine saubere Möglichkeit, den Titel beim Wechseln ein- und auszublenden? In meinem Fall habe ich die Titelumschaltung, wenn der Benutzer über 100px scrollt. Es wäre schön, den Übergang zu verblassen. Beifall.

@greatwitenorth was ist dein genauer Anwendungsfall?
Wenn Sie zB mit der Taste view2 zu einer Ansicht navigieren, können Sie den Titel mit den Requisiten wie folgt festlegen

```js
Actions.view2({ title: 'Mein neuer Titel' })

Wie können wir in der Setup-Datei darauf zugreifen?

Wenn ich eine Konfiguration wie diese habe:

<Router>
                    <Scene key="root" navBar={NavBar}>
                        <Scene
                            hideNavBar
                            key="login"
                            component={Login}
                            initial
                        />

                        <Scene drawer
                               drawerPosition="right" drawerWidth={300}
                               key="task"
                               contentComponent={DrawerView}
                               drawerIcon={drawerIcon}
                               rightButtonImage="menu"
                               onRight={() => {
                                   Actions.drawerOpen()
                               }} hideNavBar
                        >

                            <Scene key="taskInner"
                                   leftButtonImage="arrow-back"
                                   component={TaskView}
                                   onLeft={() => {
                                       Actions.popTo('tasksList')
                                   }}
                            />
                        </Scene>

                    </Scene>
</Router>

Dann funktioniert Actions.task({ title: 'My New Title' }) oder Actions.refresh({title: "My New Title"}) nicht. Wie stelle ich den Titel ein oder sende einige Eigenschaften, wenn ich eine Schublade habe?