Vue 中如何重置 Data？
在Vue中，你可以通过重写data函数的返回值来重置组件的状态。这里是一个简单的例子：
<template>
<div>
<button @click="resetData">Reset Data</button>
</div>
</template>
<script>
export default {
data() {
return {
message: 'Hello Vue!',
count: 0
};
},
methods: {
resetData() {
// 通过调用 data 函数获取初始数据的副本来重置数据
Object.assign(this.$data, this.$options.data.call(this));
}
}
};
</script>在这个例子中，我们定义了一个resetData方法，该方法通过调用data函数获取当前组件的初始数据副本，并使用Object.assign将其分配回this.$data，从而重置所有响应式状态。当用户点击按钮时，resetData方法会被触发。
评论已关闭