- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我已经更新我的路由器以采用第二条主要路线。
import React from 'react';
import { Router, Route, IndexRoute, browserHistory } from 'react-router';
// Containers & Pages
// Home
import HomePage from '/imports/ui/pages/home/HomePage.js';
// Accounts
import SignUp from '/imports/ui/pages/accounts/SignUp.js';
import Login from '/imports/ui/pages/accounts/Login.js';
import ForgotPassword from '/imports/ui/pages/accounts/ForgotPassword.js';
import ResetPassword from '/imports/ui/pages/accounts/ResetPassword.js';
import PaymentPage from '/imports/ui/pages/accounts/PaymentPage.js';
import CouponPaymentPage from '/imports/ui/pages/accounts/CouponPaymentPage.js';
import AccountPage from '/imports/ui/pages/accounts/AccountPage.js';
// General
import AppContainer from '/imports/ui/containers/AppContainer.js';
// In App
import DashboardContainer from '/imports/ui/containers/app/DashboardContainer.js';
import AllRecipesContainer from '/imports/ui/containers/app/AllRecipesContainer.js';
// Legal
import PrivacyPage from '/imports/ui/pages/legal/PrivacyPage.js';
import TermsPage from '/imports/ui/pages/legal/TermsPage.js';
import DisclaimersPage from '/imports/ui/pages/legal/DisclaimersPage.js';
// Admin
import AdminContainer from '/imports/ui/containers/AdminContainer.js';
import UsersAdminContainer from '/imports/ui/containers/UsersAdminContainer.js';
import RecipeStatsPage from '/imports/ui/pages/admin/RecipeStatsPage.js';
// Routes
export const renderRoutes = () => (
<Router onUpdate={() => window.scrollTo(0, 0)} history={browserHistory}>
<Route path="/" component={AppContainer}>
<IndexRoute name="Home" component={HomePage} />
<Route name="Sign Up" path="/signup" component={SignUp} />
<Route name="Log In" path="/login" component={Login} />
<Route name="Forgot Password" path="/forgotpassword" component={ForgotPassword} />
<Route name="Reset Password" path="/reset-password/:token" component={ResetPassword} />
<Route name="Coupon Payment Page" path="/coupons/:code" component={CouponPaymentPage} />
<Route name="Privacy Page" path="/privacy" component={PrivacyPage} />
<Route name="Terms" path="/terms" component={TermsPage} />
<Route name="Disclaimers" path="/disclaimers" component={DisclaimersPage} />
<Route name="Payment" path="/payment" component={PaymentPage} />
<Route name="Dashboard" path="/dashboard" component={DashboardContainer} />
<Route name="Browse All Recipes" path="/browseall" component={AllRecipesContainer} />
<Route name="Manage Account" path="/account" component={AccountPage} />
</Route>
<Route path="/manager" component={AdminContainer}>
<IndexRoute name="manager home" component={UsersAdminContainer} />
<Route path="/manager/recipes" component={RecipeStatsPage} />
</Route>
</Router>
);
当我在我的应用程序中导航到“/manager”时出现错误:
Warning: Functions are not valid as a React child. This may happen if you return a Component instead of from render. Or maybe you meant to call this function rather than return it. in Unknown (created by RouterContext) in RouterContext (created by Router) in Router
//AdminContainer.js
import { Meteor } from 'meteor/meteor';
import { withTracker } from 'meteor/react-meteor-data';
import Admin from '/imports/ui/layouts/Admin.js';
export default withTracker(() => {
const userHandle = Meteor.subscribe('users.myData');
const loading = !userHandle.ready();
return {
user: Meteor.user(),
loading,
};
}, Admin);
//UsersAdminContainer.js
import { Meteor } from 'meteor/meteor';
import { withTracker } from 'meteor/react-meteor-data';
import UsersAdminPage from '/imports/ui/pages/admin/UsersAdminPage.js';
export default withTracker(() => {
const usersHandle = Meteor.subscribe('users.allUsers');
const loading = !usersHandle.ready();
return {
loading,
users: Meteor.users.find().fetch(),
};
}, UsersAdminPage);
我已经尝试导入 UsersAdminPage 并将其用于索引路由的组件。我在 SO ( Functions are not valid as a React child. This may happen if you return a Component instead of from render ) 上看过这个答案。我没有看到我的错误任何帮助将不胜感激。
//包.json
{
"name": "-",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "meteor --settings dev-settings.json"
},
"dependencies": {
"autoprefixer": "^7.1.1",
"babel-runtime": "^6.26.0",
"bcrypt": "^1.0.3",
"bluebird": "^3.5.1",
"contentful": "^5.1.3",
"marked": "^0.3.6",
"meteor-node-stubs": "~0.2.4",
"moment": "^2.21.0",
"prop-types": "^15.6.0",
"radium": "^0.19.6",
"react": "^16.1.1",
"react-async-script-loader": "^0.3.0",
"react-burger-menu": "^2.1.11",
"react-document-title": "^2.0.3",
"react-dom": "^16.1.1",
"react-feather": "^1.0.7",
"react-flatpickr": "^3.6.3",
"react-router": "^3.0.5",
"react-stripe-elements": "^1.2.1",
"react-tooltip": "^3.4.0",
"reactable": "github:vladnicula/reactable",
"sib-api-v3-sdk": "^3.1.6",
"simpl-schema": "^0.3.2",
"stripe": "^5.5.0",
"sweetalert": "^2.0.8",
"sweetalert2": "^7.1.2",
"underscore": "^1.8.3"
},
"devDependencies": {
"@meteorjs/eslint-config-meteor": "^1.0.5",
"babel-eslint": "^7.2.3",
"eslint": "^4.4.1",
"eslint-config-airbnb": "^15.1.0",
"eslint-import-resolver-meteor": "^0.4.0",
"eslint-plugin-import": "^2.7.0",
"eslint-plugin-jsx-a11y": "^5.1.1",
"eslint-plugin-meteor": "^4.0.1",
"eslint-plugin-react": "^7.2.1"
},
"postcss": {
"plugins": {
"postcss-easy-import": {
"extensions": [
".css",
".scss",
".import.css"
]
},
"autoprefixer": {
"browsers": [
"last 2 versions"
]
}
}
},
"eslintConfig": {
"parser": "babel-eslint",
"parserOptions": {
"allowImportExportEverywhere": true,
"allowAfterThis": true
},
"plugins": [
"meteor"
],
"extends": [
"airbnb",
"plugin:meteor/recommended"
],
"settings": {
"import/resolver": "meteor"
},
"rules": {
"import/extensions": [
"off",
"never"
],
"import/no-extraneous-dependencies": "off",
"import/prefer-default-export": "off",
"import/no-absolute-path": "off",
"react/prefer-stateless-function": "off",
"react/jsx-filename-extension": "off",
"react/forbid-prop-types": "off",
"react/require-default-props": "off",
"no-underscore-dangle": "off",
"jsx-a11y/no-static-element-interactions": "off",
"class-methods-use-this": "off"
}
}
}
最佳答案
您对 withTracker
的调用不正确。他们应该将组件传递给 withTracker
的结果:
export default withTracker(() => {
const userHandle = Meteor.subscribe('users.myData');
const loading = !userHandle.ready();
return {
user: Meteor.user(),
loading,
};
})(Admin);
相关文档here .
关于javascript - 如何修复 : Warning: Functions are not valid as a React child,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50205031/
main.cpp #include "Primes.h" #include int main(){ std::string choose; int num1, num2; w
似乎函数 qwertyInches() 应该可以工作但是当我在 main() 中调用它时它给了我 [Error] called object 'qwertyInches' is not a funct
我无法理解 C++ 语法的工作原理。 #include using namespace std; class Accumulator{ private: int value; public:
在 类中声明 函数成员时,我们可以同时执行这两种操作; Function first; Function() second; 它们之间有什么区别? 最佳答案 Function 代表任意函数: void
“colonna”怎么可能是一个简单的字符串: $('td.' + colonna).css('background-color','#ffddaa'); 可以正确突出显示有趣单元格的背景,并且: $
我正在尝试将网页中的动态参数中继到函数中,然后函数将它们传递给函数内部的调用。比如下面这个简化的代码片段,现在这样,直接传入参数是没有问题的。但是,如何在不为每个可能的 colorbox 参数设置 s
C++ 中是否有一种模式允许您返回一个函数,它返回一个函数本身。例如 std::function func = ...; do { func = func(); } while (func);
我正在将 Windows 程序集移植到 Linux。我有一些代码要移植。我实际上是 linux 中 C 的新手。我知道 C 基础知识是一样的! typedef struct sReader {
我一直在寻找一个很好的解释,所以我很清楚。示例: this.onDeleteHandler(index)}/> 对比 对比 this.nameChangedhandler(event, perso
function(){}.__proto__ === Function.prototype 和 Function.prototype === function(){}.__proto__ 得到不同的结
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function 据说 Propert
VBA 中的函数没有特殊类型。我很难理解如何在 Excel VBA 中将函数作为参数添加到函数中。 我想要完成的是这样的事情: function f(g as function, x as strin
所以我正在尝试制作一个包(我没有在下面包含我的 roxygen2 header ): 我有这个功能: date_from_text % dplyr::mutate(!!name := lubr
尝试从 std::function 派生一个类,对于初学者来说,继承构造函数。这是我的猜测: #include #include using namespace std; template cla
我正在尝试编写一个返回另一个函数的函数。我的目标是编写一个函数,它接受一个对象并返回另一个函数“search”。当我使用键调用搜索函数时,我想从第一个函数中给定的对象返回该键的值。 propertyO
我非常清楚函数式编程技术和命令式编程技术之间的区别。但是现在有一种普遍的趋势是谈论“函数式语言”,这确实让我感到困惑。 当然,像 Haskell 这样的一些语言比 C 等其他语言更欢迎函数式编程。但即
关闭。这个问题是opinion-based 。目前不接受答案。 想要改进这个问题吗?更新问题,以便 editing this post 可以用事实和引文来回答它。 . 已关闭 8 年前。 Improv
我在stackoverflow上查过很多类似的问题,比如call.call 1 , call.call 2 ,但我是新人,无法发表任何评论。我希望我能找到关于 JavaScript 解释器如何执行这些
向 Twilio 发送 SMS 时,Twilio 会向指定的 URL 发送多个请求,以通过 Webhook 提供该 SMS 传送的状态。我想让这个回调异步,所以我开发了一个 Cloud Functio
作为 IaC 的一部分,A 功能应用 ,让我们将其命名为 FuncAppX 是使用 Terraform 部署的,它有一个内置函数。 我需要使用 Terraform 在函数应用程序中访问相同函数的 Ur
我是一名优秀的程序员,十分优秀!