最近在使用Vue的過程中，遇到了一個(gè)問題：提示“不是方法”，經(jīng)過一番研究后，總結(jié)出了以下幾種情況。

//第一種情況：調(diào)用了不存在的方法
const app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
},
methods: {
sayHello() {
console.log('Hello world!')
}
}
})
app.sayHi() // 報(bào)錯(cuò)，sayHi方法不存在
//第二種情況：方法名重復(fù)
const app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!',
sayHello() {
console.log('Hello world!')
}
},
methods: {
sayHello() {
console.log('Hi!')
}
}
})
app.sayHello() // 報(bào)錯(cuò)，sayHello方法重復(fù)定義了
//第三種情況：this指向錯(cuò)誤
const app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
},
methods: {
sayHello() {
console.log(this.message)
}
}
})
const sayHello = app.sayHello
sayHello() // 報(bào)錯(cuò)，this指向window而不是Vue實(shí)例

解決這些問題的方法也很簡單：

對于第一種情況，可以檢查一下方法是否定義正確、是否寫錯(cuò)了方法名。

對于第二種情況，可以檢查一下方法名是否重復(fù)定義了。

對于第三種情況，可以使用Vue提供的bind方法或者箭頭函數(shù)來修正this指向。

const app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
},
methods: {
sayHello() {
console.log(this.message)
}
}
})
const sayHello = app.sayHello.bind(app)
sayHello() // Hello Vue!
const app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
},
methods: {
sayHello: () =>{
console.log(this.message)
}
}
})
app.sayHello() // 報(bào)錯(cuò)，箭頭函數(shù)沒有this，this指向window

如果以上方法都無法解決問題，可以嘗試重啟一下開發(fā)環(huán)境，或者在Vue官方文檔中搜索相關(guān)問題。

總結(jié)起來，解決Vue提示“不是方法”的問題，最關(guān)鍵的是要仔細(xì)核對代碼，特別是方法的定義、命名、是否重復(fù)等問題，還要注意this指向的問題，可以使用bind方法或者箭頭函數(shù)來修正。