React-native-router-flux: عنوان ديناميكي

لقد أضفت للتو دعمًا لتعيين الخصائص بدون انتقال الملاح باستخدام Actions.refresh (props) ، يرجى تجربته (الإصدار 2.3.1)

شكرا أكسونوف.
قد لا أفهمك بشكل صحيح.
لذلك ، على سبيل المثال ، إذا أردت تغيير حالة العنوان. يمكن أن أسميه
Actions.refresh({title: 'Some other title'})
شكرا جزيلا للعودة إلي.
: 0)

سيئتي ، كل شيء يعمل بشكل رائع. شكرا جزيلا لمساعدتكم aksonov. مقدر جدا. : 0)

أواجه مشكلة تبدو وكأنها خطأ هنا في تعيين العنوان ديناميكيًا. يبدو أن Actions.refresh تعيّنه لجميع المسارات ، متجاوزًا عناوينها الثابتة.

في حالتي ، لدي إعداد رئيسي-تفصيلي حيث يحتوي المسار الرئيسي على خاصية العنوان ويتم تعيين عنوان المسار التفصيلي ديناميكيًا فقط. عندما أكون في المسار التفصيلي ويتغير العنوان ، فإن ما يحدث هو أن كلاً من العنوان وزر الرجوع يتغيران إلى نفس النص. عند الرجوع إلى الإصدار الرئيسي ، يظل العنوان الديناميكي قائمًا (بدلاً من الرجوع إلى عنوان مخططه).

أنا جديد في React Native لذا لست متأكدًا مما إذا كان هذا عن طريق التصميم أم لا ...؟

شكرا!

هل هناك طريقة لتعيينه لمشهد معين حتى لو لم أكن موجودًا حاليًا في هذا المشهد؟ بمعنى آخر

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

greatwitenorth ما هي حالة الاستخدام الخاصة بك بالضبط؟
على سبيل المثال ، إذا كنت تتنقل إلى عرض باستخدام المفتاح view2 فيمكنك تعيين العنوان باستخدام الدعائم مثل هذا

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

كانت مشكلتي أنني لم أكن أتنقل إلى مكان الحادث الذي كان بحاجة إلى تحديث عنوانه. قامت شاشتي بتحديث عنوان المستخدم ، ولكن تم عرض العنوان كعنوان على شاشة منفصلة تمامًا.

greatwitenorth واجهت نفس المشكلة. كيف تغير العنوان دون الانتقال إلى طريق جديد مع تغيير العنوان؟

حسنًا ، كان يجب أن أقرأ التوثيق بشكل أفضل ، إنه ببساطة
Actions.refresh({title: 'new title'})

greatwitenorth هل وجدت أي حل لائق؟
أنا أحضر العنوان من الحالة ، لذلك كلما تغيرت الحالة ، أريد أن يكون لطريقة عرض معينة هذه القيمة كعنوان. أحيانًا يغير الأشخاص العنوان ويتنقلون عبر زر الرجوع ، وفي هذه الحالة لا يمكنني تحديد المعلمة {title:} (وتمرير قيمة الحالة في الإجراء الخلفي) ، أو هل أفتقد شيئًا ما؟

التحديث في إحدى طرق دورة حياة المكون (أو في العرض) ، يجعل التطبيق يتعطل لأنه ربما يدخل في حلقة لا نهائية بسبب تغيير خصائص الحالة.

أطيب التحيات،

JeroenNelen واجهت مشكلة مماثلة وقمت بحلها عن طريق وضع التحديث في ComponentDidMount وتعيين الحالة في Redux Redux Redux - أقوم بربط إجراء Redux في كل إجراء مستخدم يغير العنوان ، ويحدّث حالة التطبيق ، ويدعم التحديث يقرأ التحديث جدا.

إذن شيء مثل هذا السطر في ComponentDidMount:

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

jondbm شكرًا على الاقتراح ، لكننا قررنا التبديل إلى متصفح مختلف.

أطيب التحيات،

JeroenNelen أي ملاح تستخدمه الآن؟ (إذا كنت لا تمانع في المشاركة)

لماذا لا يقوم الإعداد أدناه بتحديث الزر الأيمن؟ يكتب console.log القيمة الجديدة ، لكن العنوان الصحيح لا يتم تحديثه أبدًا؟

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 righttitle أم الزر الأيمن؟

العنوان!

أود أن أقترح استخدام شريط التنقل المخصص ، مع كل ما تريد أن تكون فيه.

jaynakus حاول وضع rightTitle الخاص بك و onRight في مكون Scene الخاص بك بدلاً من أعلى مستوى RouterWithRedux ، قد ينجح ذلك.

jondbm وضعهم في مشهد الجذر لم يتم حله ، لكن استدعاء Actions.refresh () في componentWillReceiveProps أدى إلى الحيلة ؛)

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);

انظر هنا: https://github.com/aksonov/react-native-router-flux/issues/1922

هذا رائع ، هل هناك طريقة نظيفة لإدخال / إخفاء العنوان عند التبديل؟ في حالتي ، لدي عنوان تبديل عندما يقوم المستخدم بالتمرير لأكثر من 100 بكسل. سيكون من الجميل أن يتلاشى الانتقال. هتافات.

greatwitenorth ما هي حالة الاستخدام الخاصة بك بالضبط؟
على سبيل المثال ، إذا كنت تتنقل إلى عرض باستخدام المفتاح view2 فيمكنك تعيين العنوان باستخدام الدعائم مثل هذا

شبيبة
Actions.view2 ({title: "لقبي الجديد"})

كيف يمكننا الوصول إليه في ملف الإعداد؟

إذا كان لدي تكوين مثل هذا:

<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>

ثم لا يعمل Actions.task ({title: 'My New Title'}) أو Actions.refresh ({title: "My New Title"}). كيف تحدد العنوان أو ترسل بعض الخصائص عند وجود درج؟