Perte de réactivité mutable dans l'API Composition

Question

J'essaie d'obtenir le tableau de classements de ranks_options à partir de l'assistant useForm, mais il ne garde pas la trace du tableau actuel

Veuillez vérifier ci-dessous mon code

const form = useForm({
    name: null,
    ranks: [],
});

function addRanks() {
    form.ranks.push({ name: null, id:null});
}

ranks_options = form.ranks.map(function (value) {
    return value.name;
});

Answer 1

Convertissez-le en une propriété calculée :

const ranks_options = computed(() => form.ranks.map(value => value.name)

Cela définira form.rank comme dépendance et recalculera sa valeur lorsque la dépendance change.