小编lyd*_*dal的帖子

我正在尝试在 React TypeScript 文件中实现这一点：

export class MainInfo extends Component<IProps>{
  continue = e => {
    e.preventDefault();
    this.props.nextStep();
  };

  render() {
    const { values1, handleChange } = this.props
    return (
      <div>
        <Formik
          validateOnChange={true}
          validationSchema={validationSchema}
          initialValues={{ Title: '', ActivationDate: '', ExpirationDate: '', DirectManager: '', HRBP: '' }}
          onSubmit={(data) => {
            console.log(data)
          }}

但是我收到一个参数 'e' 隐含一个 'any' 类型的 React TypeScript 错误。我应该如何解决这个问题？

编辑：我在另一个文件中有这些，我在这里使用它们作为道具

nextStep = () => {
    const { step } = this.state;
    this.setState({
      step: step + 1
    });
  };

  // Go back to …

我有一个使用react-burger-menu组件的汉堡菜单组件，它工作正常，但我希望它移动到页面的右侧并从右侧打开它。我尝试过 CSS 中的 right:0 和 float:right 并尝试更改位置系统，但要么它不移动，要么样式被破坏。如何将完全相同的菜单移到右侧？

export default props => {
  return (
  // Pass on our props
    <Menu {...props}>
      <a className='menu-item' href='/'>
          Home
      </a>

      <a className='menu-item' href='/burgers'>
          Burgers
      </a>

      <a className='menu-item' href='/pizzas'>
          Pizzas
      </a>

      <a className='menu-item' href='/desserts'>
          Desserts
      </a>
    </Menu>
  )
}

html,
body {
  margin: 0;
}

#App {
  font-family: sans-serif;
  height: 100vh;
}

#page-wrap {
  text-align: center;
  overflow: auto;
}

.bm-item {
  display: inline-block;
  text-decoration: none;
  margin-bottom: 10px;
  color: #d1d1d1;
  transition: color 0.2s;
}


.bm-item:hover { …

我设计了一个使用 TypeScript Material UI 和 Formik 进行验证的表单。我希望在我的文本字段区域中出现一个材质 UI 图标，这是我的代码：

import React from 'react'
import { Formik, Form, FieldAttributes,useField} from 'formik'
import { TextField } from '@material-ui/core'
import CalendarTodayIcon from '@material-ui/icons/CalendarToday'
import * as yup from 'yup'
import './MainInfo.css'

const MyTextField: React.FC<FieldAttributes<{}>> = ({
  placeholder,type,className,style,
  ...props
}) => {
  const [field, meta] = useField<{}>(props);
  const errorText = meta.error && meta.touched ? meta.error : "";
  return (
    <div className='container'>
    <TextField
    placeholder={placeholder}
    className={className}
    style={style}
    type={type}
    {...field}
    helperText={errorText}
    error={!!errorText}
    id="outlined-basic" 
    variant="outlined"
  />
    </div>
  ); …

IM在阵营打字稿一个初学者，我已经定义了一些道具是一个.JS，我想在一个使用的文件.tsx文件。但我在我的 TypeScript 行之一上收到此错误：

 <MyTextField style={{width:'60%'}}  name='ActivationDate' type='date' defaultValue={values1.ActivationDate} onChange={handleChange('ActivationDate')}/>

Type 'void' is not assignable to type '((event: ChangeEvent<HTMLInputElement>) => void) | ((event: ChangeEvent<HTMLSelectElement>) => void) | ((event: ChangeEvent<HTMLTextAreaElement>) => void) | undefined'.

CodeSandbox 包含我的 JS 文件和 TSX 文件：https ://codesandbox.io/s/tsx-rj694

似乎是什么问题，我该如何正确编写？

I have designed a shape and I want to determine its height based on a TypeScript-function, but the ngStyle does not apply the height to the shape.

HTML:

<div class = "card" [ngStyle] = "{'height': CalculateHeight()}" (click) = 'onSelect()'>

Function:

CalculateHeight(): number {
  let CardHeight = ((this.Card.duration.Hours * 60) +
    (this.Card.duration.Minutes)) * 2;

  if (CardHeight <= 60) {
    CardHeight = 60;
  }

  console.log(CardHeight);

  return CardHeight;
}

What is the problem?