The local component of vue router simulates the switching process of a single page, and the event method in the component cannot destroy the problem.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>

<body style="height:2000px">
    <div id="app">
        <router-view></router-view>
    </div>
    <script src="vue.js"></script>
    <script src="vue-router.js"></script>
    <script>
        var componentA = {
            template: `<div>hello world</div>`,
            methods: {
                change: function() {
                    console.log( "componentA" );    
                }    
            },
            created: function() {
                var _this = this;
                window.addEventListener( "scroll", function() {
                    _this.change();        
                }, false );
            }
        };
        var componentB = {
            template: `<div>hello life</div>`,
            methods: {
                change: function() {
                    console.log( "componentB" );    
                }    
            },
            created: function() {
                var _this = this;
                window.addEventListener( "scroll", function() {
                    _this.change();        
                }, false );    
            }    
        };
        var vm = new Vue( {
            el: "-sharpapp",
            router: new VueRouter( {
                routes: [
                    { path: "/a", component: componentA },
                      { path: "/b", component: componentB }
                ]    
            } )    
        } );
    </script>
</body>
</html>

recently encountered a problem similar to the above example, which is a simple example of simulating a single page switch, but you will find that during the switching process, with the mouse scrolling, the methods of both local components will be triggered. How to solve this situation? To reach the corresponding page, only the method of the corresponding component is triggered. Please take a look at the passing god. Thank you

removeEventListener

when destroying

components.

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b3c72c-2ba90.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b3c72c-2ba90.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?