Связь между компонентами через vuex?

Question

[kiranananda]

Здравствуйте!

Продолжаю разбираться с vue . Для связи между компонентами решил использовать vuex. Вот реализация части кода

mutations: {
        editFileId (state, id) {
            state.editFileId = id;
        },
}

Тут через мутацию записывается id элемента после присвоения которого надо открыть модальное окошко и получить сам объект.

computed: {
            fileId: {
                // cache: false,
                get: function () {
                    return this.$store.state.uploadStore.editFileId
                } 
            },
        },
        watch: {
            fileId() {
                $('#UploadEditModal').modal('show');
                ........
            }
        },

И все бы хорошо, но когда тычек идет в один и тот же объект, то не работает второй раз. Видимо где то косяк в логике, что то где то закэшировано. computed не вызывается при повторном клике даже с выключенным кэшем. Мутация отрабатывает. Как такие штуки можно решать?

Или надо проще создавать шину событий отдельным объектом и через нее общаться? Просто там как я понял надо еще усложнять код тем что при удалении компонента создавать отписки...

Comments

[Ilya]

в computed обычно из геттеров получают значения

[kiranananda]

Ilya, вроде в доке то же написано так же...

Answer 1

[kiranananda]

Вообщем не стал морочиться, сделал вот так.
Vue.prototype.$bus = new Vue();
Соответсвенно код выглядит как то так.

created () {
            this.$bus.$on('UploadEditFile', this.getData)
        },
        beforeDestroy(){
            this.$bus.$off('UploadEditFile');
        },
        methods: {
            getData(id)
            {
                $('#UploadEditModal').modal('show');
                 ...............
            }
        }

А генерация события
this.$bus.$emit('UploadEditFile', file.id);