小编vic*_*nyy的帖子

我正在使用react-bootstrap lib并且需要使用输入组件。我知道如何输入简单的输入，但有问题FormControl

class Search extends Component<Props, { searchInput: string }> {

      static defaultProps = {}

      state = {
        searchInput: ""
      }

     // This one works for input 
      searchInputSimple = (e: React.FormEvent<HTMLInputElement>): void => {
        const { getSearch } = this.props
        this.setState(
          { searchInput: e.currentTarget.value },
          (): void => getSearch(this.state.searchInput)
        )
      }

      // for FormControl. What can I use exept any?
      searchInput = (e: React.FormEvent<any>): void => {
        const { getSearch } = this.props
        this.setState(
          { searchInput: e.currentTarget.value },
          (): …

我正在使用react-big-calendar 并需要帮助来实现所需的本地化git中的示例

import BigCalendar from 'react-big-calendar';
import moment from 'moment';

BigCalendar.setLocalizer(
  BigCalendar.momentLocalizer(moment)
);

我的密码

var moment = require('moment');
var momentLocalizer = require('react-widgets/lib/localizers/moment');
import BigCalendar from 'react-big-calendar';

BigCalendar.setLocalizer(
    BigCalendar.momentLocalizer(moment.locale('en'))
);

let MyCalendar = props => (
    <div>
        <BigCalendar

        />
    </div>
);

无论我尝试了什么都行不通

未捕获的TypeError：矩不是函数

我有服务器端React/Redux/Express应用程序.React-router v4为使用Switch的服务器应用程序提供解决方案,我需要使用一些东西来改变我的NavBar组件的位置

应用

import React, { Component } from 'react'

import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'

import { Switch, Route, Redirect, Link} from 'react-router-dom'
import FirstPage from './FirstPage'
import Test from './Test'
import LoginPage from './login/LoginPage'
import NoMatch from '../components/NoMatch'
import NavBar from '../components/NavBar'

import * as loginActions from '../actions/login'

import 'bootstrap/dist/css/bootstrap.css';

class App extends Component {

  render(){
    return (
      <div>
            <NavBar/>

            <h1>EffortTracker v3.0.1</h1>

        <Switch >
            <Route exact path="/" render={loginRedirect(<FirstPage/>)}/>
              <Route path="/first" render={loginRedirect(<FirstPage/>)}/>
              <Route …

我很难理解使用React Context API的新方法。我有一个带有自定义类Firebase的应用程序。现在我想勾住它。在我使用HOC （高阶组件）和上下文之前。

我的问题

1. 我需要使用HOC还是一种新方法？
2. 我需要Context.Provider还是新的Hook？
3. 我需要将默认值声明为null还是可以从context.js中正确传递对象
4. 如何在我的代码中使用新的Hook代替HOC？

这是我的代码，其中包含与问题相关的一些注释

// context.js this is my hoc
// index.jsx
import App from './App'
import Firebase, { FirebaseContext } from './components/Firebase'

const FirebaseContext = React.createContext(null)

export const withFirebase = Component => (props) => {
  // I don't need to wrap it to the FirebaseContext.Consumer
  // 1 But do I need this HOC or it's a new way?
  const firebase = useContext(FirebaseContext)
  return <Component {...props} firebase={firebase} />
}

ReactDOM.render(
  // 2 …