vue3沒有this，vue中使用this遇到的坑

2023-11-05 阅读 24 评论 0

摘要：在兩個頁面中創建函數，并且調用一個函數中能夠獲取到代表vue實例的this，而另一個卻獲取不到頁面1： 1 <button id="login" v-text="$t('m.btn_0001')" @click="submit(form)"></button> 1

在兩個頁面中創建函數，并且調用一個函數中能夠獲取到代表vue實例的this，而另一個卻獲取不到

頁面1：

1 <button id="login" v-text="$t('m.btn_0001')" @click="submit(form)"></button>

 1 export default {
 2   name: 'Login',
 3   data () {
 4     return {
　　　　　　form: {}
 5     }
 6   },
 7   components: {},
 8   methods: {
 9     'submit': login
10   }
11 }

1 // 點擊登錄
2 function login (Para) {
3   console.log(this) // vue實例
4 }

頁面2--在vue實例創建后立馬執行函數：

 1 export default {
 2   name: 'ProjectList',
 3   data () {
 4     return {
 5     }
 6   },
 7   created () {
 8     this.getProjectList() // 函數中this 指向vue實例
 9     getProjectList2(this) // 函數中this 為undefined，th為vue實例
10   },
11   methods: {
12     'getProjectList': getProjectList
13   },
14   computed: {
15   }
16 }
17 
18 function this.getProjectList () {
19   console.log(this)  
20 }
21 
22 function this.getProjectList2 (th) {
23   console.log(th)
24   console.log(this)  
25 }