laravel5.3 vue js 方法不工作

laravel5.3 vue js methods not working

[Vue warn]: 属性 或方法 "getusers" 未在实例上定义,但在渲染期间被引用。确保在数据选项中声明响应式数据属性。 (在根实例中找到)

users.vue 文件

<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>

在 app.js 文件中

   Vue.component('users', require('./components/users.vue'));

    const app = new Vue({
        el: '#app'
    });

看来您这里有几个问题,而且您没有提供足够的信息来调试整个问题。我至少可以让你知道我看到的几个问题:

  1. 在上面粘贴的示例中,您在 </ul> 结束标记之后缺少结束 </template> 标记。
  2. 在您的用户组件中,您从不调用 getusers() 方法,您只定义它。根据您的代码,我假设您想将 items 设置为 getusers() 方法的结果。