在應用程序中包含簡單組件時的錯誤（react/redux）

我有一個基於https://github.com/coryhouse/react-slingshot/的樣板。我已經刪除了FuelSavings應用程序並將其替換爲可以正常工作的應用程序 - 但是我編寫了一個組件，並且當我將它包含在應用程序下時，它可以防止任何渲染（我獲得白頁）。在應用程序中包含簡單組件時的錯誤（react/redux）

我得到3個錯誤，當我在<UserHeader />標籤添加到App.js：

「警告：React.createElement：類型不能爲空，未定義，布爾，或數它應該是一個字符串（用於DOM元素）或ReactClass（用於複合組件）。檢查渲染方法App。「未捕獲的不變違例：元素類型無效：預期爲字符串（對於內置組件）或類/函數（對於複合組件），但得到：undefined。檢查App的渲染方法。
遺漏的類型錯誤：無法讀取的不確定

財產「道具」如果我刪除UserHeader標籤，頁面加載蠻好的其餘部分。

的src /組件/ App.js

import React, { PropTypes } from 'react'; 
import { Link, IndexLink } from 'react-router'; 
import { UserHeader } from './UserHeader'; 

const App = (props) => { 
    return (
    <div> 
     <IndexLink to="/">Home</IndexLink> | <Link to="/About">About</Link> 
     <UserHeader /> 

     {props.children} 
    </div> 
); 
}; 

export default App;

的src /組件/ UserHeader.js

import React, { Component, PropTypes } from 'react'; 

const UserHeader = (props) => { 
    return (
    <p>Welcome!</p> 
    ); 
}; 

export default UserHeader;

歡迎任何想法。服務器本身顯示沒有問題，只是關於缺少道具驗證的警告。該問題阻止UserHeader中的任何代碼執行。我只是沒有足夠的經驗知道如何！

來源

2016-03-17 charlie

此：

import { UserHeader } from './UserHeader'

應該是：

import UserHeader from './UserHeader'

因爲UserHeader是默認的出口。

來源

2016-03-17 00:43:51 pfkurtz

就是這樣！謝謝！ – charlie

不客氣。 – pfkurtz

在應用程序中包含簡單組件時的錯誤（react/redux）

回答

相關問題