Vuexの別のアクション内からアクションを呼び出すのは悪い習慣ですか？

Question

Vueアプリで次の2つの選択肢を検討しています。別のアクション内からアクションを呼び出すかどうか、またはそれが面倒かどうかを判断しようとしています。

代替案：

store.js

const actions = {
    funcOne (context) {
        //Do something
        context.dispatch(funcTwo)
    }
    funcTwo () {
        //Do something else
    }
}

component.vue

methods: {
    doSomething () {
        this.$store.dispatch(funcOne)
    }
}

または代替2：

store.js

const actions = {
    funcOne () {
        //Do something
    }
    funcTwo () {
        //Do something else
    }
}

component.vue

methods: {
    doSomething () {
        this.$store.dispatch(funcOne)
        this.$store.dispatch(funcTwo)
    }
}

ここにベストプラクティスはありますか、それとも私がこれらのどれを選択してもかまいませんか？

Answer 1

それは悪い習慣ではありません！それらは簡単に作成できるように設計されており、ドキュメントにはその例さえあります。

アクションが緊密に結合されている場合、つまり、いずれの場合も一方を次々に呼び出す必要がある場合は、アクションをディスパッチしてから、最初のアクションで2番目のアクションを呼び出すことをお勧めします。

それらが分離されている場合、つまり、任意の順序で呼び出すことが問題なく、別々に使用できる場合は、メソッドから両方のアクションを呼び出すことで、コーディングスタイルでこれをより適切に伝達できます。

アクションは非同期アクションを対象としているため、async / awaitをうまく利用すると、管理が非常に簡単になります。