Получайте определенные данные из хранилища vuex при использовании маршрута

Похоже, вам не хватает атрибута name в тэгах fragment в файле макета активности. Существует два способа получить фрагмент, завышенный в вашей иерархии просмотров:

  1. Укажите все в макете XML
  2. Загрузите фрагмент в свой Java-код

Кажется, что вы смешали эти две парадигмы вместе, что и вызывает у вас проблемы.

Чтобы сделать все в XML-макете, вы должны указать name. Итак, что-то вроде этого:

<fragment
    android:name="com.my.package.for.Frag1"
    android:id="@+id/frag_1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"/>

Затем вы можете удалить код из вашего метода initViews(), поскольку он больше не нужен.

Если вместо этого вы предпочли бы делать все в коде, тогда вы должны изменить свой макет, чтобы указать пустой контейнер, куда будет идти фрагмент. Например, используйте FrameLayout вместо тега fragment, например:

<FrameLayout
    android:id="@+id/frag_1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"/>
0
задан P3trur0 13 July 2018 в 16:18
поделиться

2 ответа

Во-первых, добавив props: true к вашему объекту маршрута, вы можете передать параметры маршрута в качестве реквизита вашего компонента PhysicianProfile

    {
        path: '/physicians/profile/:firstName-:lastName-:designation',
        name: 'pd-profile',
        component: PhysicianProfile,
        props: true
    },

. Затем вы можете добавить эти три реквизита к своему компоненту PhysicianProfile, и установите геттер Vuex для извлечения врача:

getters: {
  // ...
  getPhysicianByDetails: (state) => (firstName, lastName, designation) => {
    return state.physicians.find(phys => phys.firstName === firstName && phys.lastName === lastName && phys.designation === designation)
  }
}

Проверьте их для дальнейшего чтения

https://medium.com/vue-by-example / learn-fast-pass-params-as-props-with-vue-router-f4905735b747

https://vuex.vuejs.org/guide/getters.html

1
ответ дан Jeff 17 August 2018 в 12:34
поделиться

Вы можете передать реквизит через URL-адрес, в данном случае, идентификатор врача. Затем вы можете получить врача в созданном крючке жизненного цикла:)

Чтобы упростить объяснение, я добавлю идентификатор на ваш путь (/ doctor / profile / id / firstName-lastName-обозначение) , Вы можете изменить метод поиска в созданном вами крюке, чтобы удовлетворить ваши потребности:)

// Router
  {
     path: '/physicians/profile/:id/:firstName-:lastName-:designation',
     name: 'pd-profile',
     component: PhysicianProfile,
     props: true
  },

Затем вам нужно установить реквизит и выбрать врача в PhisicianProfile.vue:

<template>
    <div class="physician-profile">
        <h1 class="mb-5">{{ msg }}</h1>
    </div>
</template>

<script>
    export default {
        name: 'pd-profile',
        props: {
            id: {
                required: true
            },
            // rest of the props if needed
        },
        data () {
            return {
                msg: 'Physician Profile',
            }
        },

        created () {
            // Fetch the physician with based on this.id
            const physician = this.$store.state.physicians.find((physician) => { return physician.id == this.id })
            // Do something with physician (set to data and use in template)
        }
    }
</script>

Для получения дополнительной информации о передаче реквизита, проверьте vue router documentation :)

0
ответ дан RAH 17 August 2018 в 12:34
поделиться
  • 1
    когда вы говорите, что установлены данные, что вы имеете в виду? Когда я утешаю врача, я вижу объект, поэтому я предполагаю, что вы хотите добавить новый элемент под данными (возможно, пустой массив) и установить равный ему врач. – mcallaro 13 July 2018 в 18:31
  • 2
    вы должны использовать гейтер Vuex, а не просто вытащить врача, чтобы он реагировал на изменения в Vuex. – Jeff 13 July 2018 в 19:04
  • 3
    mcallaro, вы поняли меня правильно, установите пустой объект / массив в данные, которые будут содержать то, что вы извлекаете. Джефф также прав, вы должны использовать getter для получения данных из Vuex. Я интерпретировал ваш вопрос в основном как вопрос vue router, как передать параметр. Если вы хотите изучить Vuex, ознакомьтесь с нашим курсом: Vuex для всех – RAH 14 July 2018 в 08:22
  • 4
    Спасибо вам за то, что вы ответили. Я смог заставить его работать с геттерами в первый раз, просто хотел посмотреть, есть ли другие варианты. Еще раз спасибо. – mcallaro 16 July 2018 в 15:11
Другие вопросы по тегам:

Похожие вопросы: