[Vue warn]: Property or method "getusers" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. (found in root instance)
users.vue file
<template>
<ul class="list-group">
<li class="list-group-item" v-for="item in items">
{{ item.fname }}
</li>
</ul>
</template>
<script>
export default {
data: function() {
return {
items: []
}
},
methods: {
getusers: function () {
this.$http.post('/users_search', this.formData).then(function(response) {
console.log(response)
}, function() {
console.log('failed')
})
}
}
}
</script>
in the app.js file
Vue.component('users', require('./components/users.vue'));
const app = new Vue({
el: '#app'
});
It looks like you have several issues here, and that you have not provided enough information to debug the overall problem. I can at least let you know about a couple of issues I see:
</template>
tag after the closing </ul>
tag.getusers()
method, you only define it. Based on your code, I assume you want to set items
as the results of the getusers()
method.