<el-switch> 初始值通过查询获取
时间: 2023-08-07 16:02:08 浏览: 71
如果您需要从后端获取 `<el-switch>` 开关的初始值,您可以在组件的 `created` 钩子函数中发起异步请求,并将响应的数据赋值给组件的 `switchValue` 数据属性。例如:
```
<template>
<el-switch v-model="switchValue" @change="saveSwitchValue"></el-switch>
</template>
<script>
export default {
data() {
return {
switchValue: false // 初始化时默认开关的值为 false
};
},
created() {
// 发起异步请求获取开关的初始值
this.fetchSwitchValue().then((data) => {
this.switchValue = data.switchValue;
});
},
methods: {
fetchSwitchValue() {
// 发起异步请求获取开关的初始值
// 例如,可以使用 axios 库来发起请求
return axios.get('/api/switch-value').then((response) => {
return response.data;
});
},
saveSwitchValue() {
// 将开关的值保存到您的数据源中
// 例如,可以将其存储到 Vuex store 中
this.$store.commit('saveSwitchValue', this.switchValue);
}
}
};
</script>
```
在上面的代码中,我们在组件的 `created` 钩子函数中发起异步请求,获取开关的初始值,并将其赋值给组件的 `switchValue` 数据属性。在开关状态发生变化时,我们将其保存到数据源中,这与上一个问题的处理方式是相同的。请注意,上面的示例使用了 axios 库来发起异步请求,您可以根据您的具体情况使用其他库或原生的 XMLHttpRequest 对象来发起请求。
阅读全文