解決由於export，import錯誤導致的元素型別無效【Element type is invalid】
前些日子做專案時有一個報錯，雖然解決了，但是對於導致的原因，還是一知半解。今天突然發現一篇部落格，大受啟發，決定將這個問題系統的總結一下。
報錯資訊：
提示元素型別無效，可能是忘記從你定義的檔案中匯出來元件，或者是你弄混了要匯入的元件的預設名字，沒有和你匯入時的名字相對應。
解決方式：
1：在匯出檔案中使用 export class 元件類名稱 extends Component 將元件匯出。此時可以在要匯入的地方使用 import {元件類名稱} from “路徑” 進行匯入使用。
2：在匯出檔案類中，使用 class 元件類名稱 extends Component 對元件類進行定義，並在定義之後使用 export default 元件類名稱 的方式將元件進行匯出。此時可以在要匯入的地方使用 import 元件類名稱 from “路徑” 方式將需要的元件類匯入進來。
原因分析：
在初識 react-native 時就在想為什麼每個檔案最上面的匯入外部元件的方式會有不同
import { View, Text } from "react-native"
import TestCompontent from "../../TestCompontent"
為什麼一個帶大括號，另一個就不帶大括號呢？？？
第一種方式：
帶大括號的表示在匯出檔案中使用的是 export class 元件類名稱 extends Component
而我們常見的帶大括號引入的元件，都是從一些第三方庫中引入的元件檔案，例如從 react-native 中引入的 View，Text 元件。這些都是固定的元件名字，他是需要檢視文件，我想引入一個 View ，就必須知道在這個第三方庫中存在 View 這個第三方元件，況且一個第三方庫中有許許多多的元件，因此必須知道確切的名稱才能進行匯入，而不能自己隨意的起名。
第二種方式：
不帶大括號是使用export default 元件類名稱 的方式將元件類進行匯出。此時一般都是一些自定義的元件，況且在自定義元件中一般一個檔案只有一個元件，因此只要
import 的來源是正確的，就可以將元件類的名稱進行自定義取名
import Test from "../../TestCompontent"
總結：
1：其實上述兩種方式的區別主要就是 export class 和 export default class 的區別。使用 export default 的方式將元件匯出時就可以將元件類的名稱進行自定義。如果使用 export 的方式進行自定義，那麼就必須按照定義元件類時的名稱進行匯入。
2：有幫助的部落格連結：
https://segmentfault.com/a/11...