return 渲染中没有任何内容。这通常意味着缺少 return 语句。或者,为了不呈现任何内容,return null。但是应用程序仍然呈现
Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null. But app still renders
大家好,我是 Meteor 的新手,我反应过来,正在开发客户门户网站。我已经改编了 meteor react 教程以按照我需要的方式工作,并且正在使用 Flow Router 进行路由。目前一切正常,除了我仍然收到此错误 Uncaught Error: AppMount(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.
,无论我做什么。
这是我的路由代码以及主页的大部分代码:
main.jsx
import AppMount from '/imports/ui/AppMount'
import "./routes"
Meteor.startup(() => {
render(<AppMount />, document.getElementById('root'))
})
AppMount.jsx
const AppMount = props => {
return (props.content);
}
export default AppMount
App.jsx
const App = () => {
const user = useTracker(() => Meteor.user());
const { tasks, isLoading } = useTracker(() => {
const noDataAvailable = { tasks: [] };
if (!Meteor.user()) {
return (noDataAvailable);
}
const handler = Meteor.subscribe('tasks');
if (!handler.ready()) {
return ({ ...noDataAvailable, isLoading: true });
}
const tasks = TasksCollection.find(
userFilter,
{
sort: { status: 1 },
}
).fetch();
return ({ tasks });
});
return(
<div className="app">
<Header />
<div className="main">
{user ? (
<Fragment>
<div className="menu">
{user.admin && (
<Fragment>
<button className="addUser" onClick={newUser} >
Add New User
</button>
<button className="addTask" onClick={addTask} >
Add Task
</button>
</Fragment>
)}
<button className="changePass" onClick={changePass} >
Change Password
</button>
<button className="user" onClick={logout} >
Logout: {user.username}
</button>
</div>
{isLoading && <div className="loading">loading..</div>}
<ul className="tasks">
{tasks.map(task => (
<Task
key={task._id}
task={task}
onCheckboxClick={toggleChecked}
onDeleteClick={deleteTask}
advanceStage={advanceStage}
revertStage={revertStage}
/>
))}
</ul>
</Fragment>
) : (
<LoginForm />
)}
</div>
</div>
);
}
export default App
routes.jsx
FlowRouter.route('/', {
name: 'Home',
action() {
mount(AppMount, {
content: <App />
})
}
})
我知道以前有人问过这个问题,但我相信我已经尝试了所有解决方案都无济于事。
感谢任何帮助。
props.content
需要 {}
const AppMount = props => {
return {props.content};
}
大家好,我是 Meteor 的新手,我反应过来,正在开发客户门户网站。我已经改编了 meteor react 教程以按照我需要的方式工作,并且正在使用 Flow Router 进行路由。目前一切正常,除了我仍然收到此错误 Uncaught Error: AppMount(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.
,无论我做什么。
这是我的路由代码以及主页的大部分代码:
main.jsx
import AppMount from '/imports/ui/AppMount'
import "./routes"
Meteor.startup(() => {
render(<AppMount />, document.getElementById('root'))
})
AppMount.jsx
const AppMount = props => {
return (props.content);
}
export default AppMount
App.jsx
const App = () => {
const user = useTracker(() => Meteor.user());
const { tasks, isLoading } = useTracker(() => {
const noDataAvailable = { tasks: [] };
if (!Meteor.user()) {
return (noDataAvailable);
}
const handler = Meteor.subscribe('tasks');
if (!handler.ready()) {
return ({ ...noDataAvailable, isLoading: true });
}
const tasks = TasksCollection.find(
userFilter,
{
sort: { status: 1 },
}
).fetch();
return ({ tasks });
});
return(
<div className="app">
<Header />
<div className="main">
{user ? (
<Fragment>
<div className="menu">
{user.admin && (
<Fragment>
<button className="addUser" onClick={newUser} >
Add New User
</button>
<button className="addTask" onClick={addTask} >
Add Task
</button>
</Fragment>
)}
<button className="changePass" onClick={changePass} >
Change Password
</button>
<button className="user" onClick={logout} >
Logout: {user.username}
</button>
</div>
{isLoading && <div className="loading">loading..</div>}
<ul className="tasks">
{tasks.map(task => (
<Task
key={task._id}
task={task}
onCheckboxClick={toggleChecked}
onDeleteClick={deleteTask}
advanceStage={advanceStage}
revertStage={revertStage}
/>
))}
</ul>
</Fragment>
) : (
<LoginForm />
)}
</div>
</div>
);
}
export default App
routes.jsx
FlowRouter.route('/', {
name: 'Home',
action() {
mount(AppMount, {
content: <App />
})
}
})
我知道以前有人问过这个问题,但我相信我已经尝试了所有解决方案都无济于事。
感谢任何帮助。
props.content
需要 {}
const AppMount = props => {
return {props.content};
}