Далее JS 9.3 Ссылка не является функцией конструктора для элементов JSX - PullRequest
Новая
       8

Далее JS 9.3 Ссылка не является функцией конструктора для элементов JSX

0 голосов
/ 26 апреля 2020

пытается создать элемент Link с заголовком и слагом для href. 

import React from 'react';
import Link from 'next/link';
import styled from 'styled-components';

type Props = {
  title: string;
  slug: string;
};

const NavElement = ({ title, slug }: Props) => {
  return (
    <Link href={slug}>
      <a>{title}</a>
    </Link>
  );
};

export default NavElement;

Зависимости в пакете. json

  "dependencies": {
    "@types/react": "^16.9.34",
    "@types/styled-components": "^5.1.0",
    "axios": "^0.19.2",
    "contentful": "^7.14.3",
    "moment": "^2.24.0",
    "next": "9.3.5",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-lottie": "^1.2.3",
    "styled-components": "^5.1.0"
  }

Получение этой ошибки: 

JSX element type 'Link' is not a constructor function for JSX elements.
  Type 'Link' is missing the following properties from type 'ElementClass': context, setState, forceUpdate, props, and 2 more.ts(2605)
JSX element class does not support attributes because it does not have a 'props' property.ts(2607)

Прошел через следующие js документы и предыдущие случаи, когда я делал это и за всю свою жизнь не мог определить, что не так. Любые советы?

1 Ответ

0 голосов
/ 26 апреля 2020

Вы пропускаете оператор возврата, если заключаете в скобки

Попробуйте это ... 

const NavElement = ({ title, slug }: Props) => (
  <Link href={slug}>
    <a>{title}</a>
  </Link>;
);

или это 

const NavElement = ({ title, slug }: Props): JSX.Element => {
  return (
    <Link href={slug}>
      <a>{title}</a>
    </Link>
  );
};
...