javascript - Vue.js观看对象然后执行方法失败

我想看一个 Prop ，它是一个物体，所以我有

<script>
export default {
    watch:{
        filter: {
            handler:(newval)=> {
               console.log("i have new data",newval) //this works
               this.fetchData(); //throws an error
            },
            deep: true
        }
    },
    props:{
        filter:{
            type:Object,
            required:true
        }
    },
    data: () => ({
        pagination: {},
        items: []
    }),
    methods:{
        fetchData(){
            console.log("am fetching the data");
        }
    }
}

上面的监视程序作为console.log显示新值，但我无法执行方法，因为监视程序出现错误监视程序“过滤器”的回调发生错误:“TypeError:_this.fetchData不是函数”。我如何在深度监视程序上执行方法。

最佳答案

将箭头函数移至handler method的简单函数。将handler:(newval)=> {更改为handler: function (newval) {:

Vue.js docs:

handler: function (newval) {
  console.log("i have new data",newval) //this works
  this.fetchData(); // it should work
},

关于javascript - Vue.js观看对象然后执行方法失败，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/55198329/