V-on click issue-CodePudding

I'm trying to run the logout function once the a tag is clicked in my navbar. So, I make the onclick function in my vue component. But when I click it nothing happens in my browser.

Code in my vue component:

                    <ul >
                       <li ><a href="/" >Home</a></li>
                       <li ><a href="#" >Product</a></li>
                       <li ><router-link  :to="{name:'Login'}">Login</router-link></li>
                       <li ><a href="#"   v-on:click="logout">Logout</a></li>
                       <li ><router-link  :to="{name:'Cart'}"><i ></i></router-link></li>
                   </ul>
               </div>
<script>
import store from '../store'
export default {
    name:'nav_bar',
    method:{
         logout(){
            console.log('logout') just for testing;
        }
    }
}

CodePudding user response：

You have typo in method:, should read methods with s in the end :)

CodePudding user response：

It's just a typo error, it's methods not method

 methods:{
  logout(){
        console.log('logout') just for testing;
    }

     }