vue防抖实现

苏七的猫

于 2022-06-16 16:48:46 发布

阅读量150

点赞数

文章标签： vue.js javascript 前端

本文链接：https://blog.youkuaiyun.com/pacholy/article/details/125319033

版权

这篇博客探讨了在Vue.js中如何导入并使用设置组件和评分组件。内容涉及到使用fetch-jsonp库进行JSONP请求，以及在搜索事件中应用防抖动技术以优化远程方法调用，提高性能。在方法部分展示了debounce函数和onSearchDebounce方法的实现，用于延迟执行远程查询。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<script>
import setting from './components/setting.vue';
import rating from './components/rating.vue';
import jsonp from 'fetch-jsonp';
export default {
    components: {
        setting,
        rating,
    },
    data() {
        return {
            timer: null,
        };
    },
    methods: {
        debounce(fn, delay) {
            clearTimeout(this.timer);
            this.timer = setTimeout(() => {
                fn();
            }, delay);
        },
        onSearchDebounce(val) {
            this.searchVal = val;
            this.debounce(this.remoteMethod, 2000);
        },
        remoteMethod() {
            console.log(111);
        },
    },
};
</script>