vue input双向数据绑定延迟的问题

Question

我利用inpu做了一个开关按钮 绑定一开始是关闭状态 也就是isOpen为false，
然后每次进入组件的时候在created里调用getAutoInvestInfo方法去请求数据 如果返回的status为1就就让开关变成开启状态 也也就是isOpen变成true
现在有个问题就是每次进入组件的时候开关默认关闭的 然后可能是由于要调接口获取数据需要时间导致开关开启有延迟 也就是一进入组件开关显示的是关闭状态 经过很短的时候之后变成了开启
这种感觉不太好 虽然默认是关闭的 但是我想如果返回的status是1 q我看到的直接就是开启状态 不想看到由关闭变成开启的状态 这个有办法解决吗

HTML代码
<input type="checkbox" v-model="isOpen" id="switchAutoInvest" class="regular-checkbox big-checkbox" />
<label for="switchAutoInvest" id="label"></label>

created里
this.getAutoInvestInfo()
请求到数据后
if(data.status == 1) {// 已开启
this.isOpen = true
}
上传不 了图片 就不发图了

Answer 1

你这样的话，你的请求放在beforeRouteEnter钩子中，在进入路由之前获取数据。

Answer 2

加一个loading效果，获取到数据后，去掉loading效果

Answer 3

可能此操作是异步的，改成同步的试试

Answer 4

可以设置一个flag默认为false，添加到根元素上， 当created里面的函数拿到结果后设置flag 为true，然后显示全部内容。