Je peux le faire fonctionner si j'utilise l'API de composition dans Vue 3 et la méthode setup() habituelle comme ci-dessous :

<script>
  import { useStore } from 'vuex'
  import { computed } from 'vue'

  export default {
    const store = useStore()

    setup () {
      const loginStatus = computed(() => store.getters.loginStatus)

      return { loginStatus }
    }
  }
</script>

loginStatusMaintenant disponible en modèles et prêt à être utilisé en HTML.

Mais lorsque j'essaie d'utiliser la nouvelle syntaxe <script setup>, le const n'est plus capturé et exposé au modèle.

Je ne devrais rien renvoyer de la configuration du script, mais cela ne se produit pas automatiquement non plus. Eslint marque script setup中返回任何内容，但它也不会自动发生。Eslint将loginStatus comme inutilisé. Je ne trouve aucune information sur la façon d'utiliser Vuex dans ce contexte :

<script setup>
  import { useStore } from 'vuex'
  import { computed } from 'vue'
  const store = useStore()

  const loginStatus = computed(() => store.getters.loginStatus)
</script>

Est-ce que cette attente ne va pas fonctionner ? Ou connaissez-vous une approche recommandée ?

Edit 1 :

Je connais cette réponse où la solution acceptée n'est pas la syntaxe API de composition recommandée, la deuxième réponse implique d'écrire du code passe-partout de ma propre création qui rend possible ce que je veux faire, mais ne semble pas être la manière officielle (Si il y en a un ).

Edit 2 :

Comme les commentateurs l'ont souligné, mon code fonctionne réellement. Cependant, j'ai été trompé par l'extension Vetur marquant les variables comme non renvoyées. Donc, dans le modèle, il me semble que c'est pour cela qu'il n'est pas capturé. En fait, une erreur sans rapport est la véritable cause.

En raison de ce problème Vetur, j'utilise toujours l'ancienne syntaxe de configuration pour le moment.