<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>使用lodash库减少watch对后台请求的压力</title>
    <script src="vue.js"></script>
    <script src="node_modules/axios/dist/axios.js"></script>
    <script src="node_modules/lodash/lodash.js"></script>
</head>
<body>
<div >
    <input type="text" v-model="word"/>
    <h1>
        结果:{{result}}
    </h1>
</div>
<script>
    var app = new Vue({
            el: '#lantian',
            watch: {
                //使用debounce时,需要使用:npm install lodash安装lodash。
                word: _.debounce(
                    function (newV, oldV) {
                        axios.get('9.php?word=' + newV).then(function (response) {
                            console.log(response);
                            app.result = response.data;
                        });
                    }, 3000
                )
            },
            data: {
                word: '',
                result: ''
            }
        })
    ;
</script>
</body>
</html>

  

相关文章:

  • 2021-07-29
  • 2022-12-23
  • 2022-12-23
  • 2021-06-05
  • 2021-04-26
  • 2022-12-23
  • 2021-10-20
  • 2021-09-13
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-07-01
  • 2021-08-02
  • 2021-09-19
相关资源
相似解决方案