今天在開發新組件時,在使用defineComponent定義組件時,把name寫成了文件名的首字母大寫法導致項目一直報錯。找了很久才知道是名字的問題。
defineComponent組件名字和文件名字不能一樣
在某些情況下,將組件的名稱與文件名相同可能會導致一些工具或框架出現問題。這可能是因為工具或框架在處理組件時依賴于組件名稱和文件名的唯一性,如果它們相同,則可能會引起沖突或錯誤。
這個時候我們在定義組件時,name一定不能與文件名相同,否則在調用組件時就會發生沖突。
但是在Vue 3中,使用`defineComponent`來定義組件時,Vue 不再使用 `name` 選項來指定組件的名稱,而是推薦使用 `filename` 選項。因此,如果組件的名稱與文件名相同,可能會導致Vue無法正確解析或處理組件。
但是為了避免可能出現的問題,還是建議在定義組件時使用不同于文件名的名稱。
這樣可以確保代碼在處理和解析時不會引發沖突或錯誤。
法一:
//文件名:test1.vueexport default defineComponent({name: 'MyTest1',//注意看這一行setup() {//...}
})
法二:
//文件名:test1.vueexport default defineComponent({fileName: 'Test1',//注意看這一行setup() {//...}
})