Javascript Vue在Axios API调用中将布尔值从true更改为false

我正在使用Vue.js和Axios进行API调用。 当调用返回时，我想将一个假变量暂时设置为真。我正在使用SetTimeout来执行此操作。我遇到的问题是，除非我硬编码，否则变量名Vue不会响应

在我的模板中

<i v-if="fnameEntered" id="fnameCheckPlacement" class="fnameCheck" class="form-control-feedback glyphicon glyphicon-ok" style="margin-right: 10%;"></i> 

我正在尝试将

this.fnameEntered

作为变量

复选标记传递到updateUserInfo中。当我硬编码
this.fnameintered=true
和
this.fnameintered=false
时。我得到了我想要的结果

但是，当我尝试使用“this.checkMark”或“self.checkMark”时，什么都没有发生。我做错了什么。
当然不行了。当您将
this.fnameEntered
传递到方法调用中时，您不再持有对原始属性
fnameEntered
的引用，只保留调用该方法时包含的值的副本。此外，
this.checkMark
和
self.checkMark
将检查硬编码属性名
checkMark
，这与变量名
checkMark
完全不同

如果要检索动态属性名称的值，需要执行以下操作：

1.以字符串形式传入所需属性的名称。

2.使用传入的属性名称检索值

这将看起来像这样：

methods: {
    submitFirstName: function(event){
        this.updateUserInfo(this.fname, "fname", "fnameEntered");
    },
    updateUserInfo: function (val, field, propertyName) {
        axios.post('/userprofilepage', {
            val: val,
            field: field
        })
            .then(response => {
                let self = this;
                setTimeout(function() {

                    self.$data[propertyName] = false;
                }, 2000);
                this.$data[propertyName] = true;
            })
            .catch(error => {
                console.log(error);
            })
            .finally(() => this.loading = false)
    }
}

它没有更新，因为您正在传递一个布尔值，它是基本数据类型。JavaScript总是将基本数据类型作为值而不是引用传递到函数中。有两种方法可以让它工作

在方法中使用
this.fnameEntered
将
this.fnameEntered
更改为对象，作为
this.fnameEntered={value:false}
然后在方法中使用
checkMark.value=true
在传递变量时，为什么要使用
this.checkMark
？它不应该只是
checkMark=false
？@gilango已经尝试过了，但没有成功。一分钟后错过了：D@gilango通过指出传入对象而不是原语的选项，您的答案仍然很有价值。我建议澄清OP应该避免使用
this。如果使用您的解决方案，请勾选
（我可以看出这很容易被忽略），并可能显示示例代码，但除此之外，您的解决方案仍然是此处所示解决方案的建设性替代方案：）
methods: {
    submitFirstName: function(event){
        this.updateUserInfo(this.fname, "fname", "fnameEntered");
    },
    updateUserInfo: function (val, field, propertyName) {
        axios.post('/userprofilepage', {
            val: val,
            field: field
        })
            .then(response => {
                let self = this;
                setTimeout(function() {

                    self.$data[propertyName] = false;
                }, 2000);
                this.$data[propertyName] = true;
            })
            .catch(error => {
                console.log(error);
            })
            .finally(() => this.loading = false)
    }
}