Vue 实现数据自动刷新
想要在 Vue 中实现数据自动刷新，需要将修改数据的操作从 loadDataList 方法中移出。这是因为 new Vue() 方法在首次创建时会获取模板，而后续调用不会再获取模板，只会获取渲染后的内容。
为了解决这个问题，可以使用 Vue 的数据绑定特性。当 searchResultList 数据改变时，Vue 会自动更新视图。
修改后的代码如下：
立即学习“前端免费学习笔记（深入）”；
var data = [{'title': 'hello1'}, {'title': 'hello2'}];
var app = new Vue({
el: '#searchResult',
data: {
searchResultList: data
}
});
document.getElementById('searchBtn').onclick = function () {
if (document.getElementById('searchIpt').value == '1') {
console.log(1);
app.searchResultList = [{'title': 'hello3'}, {'title': 'hello4'}];
} else if (document.getElementById('searchIpt').value == '2') {
console.log(2);
app.searchResultList = [{'title': 'hello5'}, {'title': 'hello6'}];
}
};修改后的代码中，当点击搜索按钮时，会直接修改 searchResultList 数据，从而触发 Vue 的数据绑定，实现数据的自动刷新。
以上就是如何实现 Vue 中数据的自动刷新？的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告
收藏
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
1009
