function - Vuejs变量值不变

Question

我有一个 vue 选择组件，根据我想要更改内容的选择，并在更改事件时显示加载屏幕。

<template>
    <div>
        <div class="row component-separation audit-select">
            <div class="col-md-4 pull-right">
                <v-select
                    id="auditModeSelect"
                    :options="auditOptions"
                    label="label"
                    placeholder="Change Audit View Type"
                    class="form-control border-bottom"
                    v-model="auditOption"
                    @input="changeViewMode"
                    :clearable="false">
                </v-select>
            </div>
        </div>
{{loadingTheContent}}
        <div v-if="loadingTheContent">
            <loading/>
        </div>
        <div v-else>
        ....
        </div>
    </div>
</template>


    changeViewMode(selectedMode) {
        this.loadingTheContent = true;

        if (selectedMode && selectedMode.value === 1) {
            ...
        } else {
            ...
        }

        this.loadingTheContent = false;
    },

但是 loadingTheContent 变量的值总是假的，不会改变。

我也尝试添加自定义按钮来触发，但同样的事情存在