Stuck with scope and "this"


#1

this is the code on a component

import Axios from 'axios'

    export default {
        data() {
            return {
              users: [],
              current_page:1,
              allUserstotal:0,
              total_pages: 2,
              limit:0,
            }
        },
        created() {
            this.fetchUserList()
        },
        methods: {
            fetchUserList: () => {
                axios.post('/api/users/list',{
                    start: this.current_page,
                    limit: this.limit
                })
                .then(({data}) => {
                    this.users = data.users
                    this.current_page = data.current_page
                    this.allUserstotal = data.allUserstotal
                    this.start = data.current_page
                    this.limit = data.limit
                    this.total_pages = data.total_pages
                })
            },
            changePage: (direction) => {
                this.current_page = this.current_page + direction
                this.fetchUserList()
            }
        }
    }

I can’t set the values from withint the fetchuserlist method (although this and data shows the correct info) and I can’t call a method inside the other method. I know it should be simple. but what am I doing wrong? TIA


#2

You should’t use arrow functions in the instance methods, as this will be bound to the parent context, not the vue instance.


#3

Yes, just realized that. editing that makes it work perfectly. was just now trying to find the “mark as solved” button :slight_smile: