“类型 ' children: Element[]; pictureUrl: string; ' 不可分配给类型 'IntrinsicAttributes & children?: Reac

Posted 2023-03-06

【中文标题】“类型 \' children: Element[]; pictureUrl: string; \' 不可分配给类型 \'IntrinsicAttributes & children?: ReactNode; \'

【英文标题】："Type ' children: Element[]; pictureUrl: string; ' is not assignable to type 'IntrinsicAttributes & children?: ReactNode; '“类型 ' children: Element[]; pictureUrl: string; ' 不可分配给类型 'IntrinsicAttributes & children?: ReactNode; '

【发布时间】：2020-08-25 06:34:14

【问题描述】：

我遇到了 Typescript 和以下消息的问题：

孩子：元素[];图片网址：字符串； ' 不可分配给类型 'IntrinsicAttributes & children?: ReactNode; '

类型'IntrinsicAttributes & children?: ReactNode; 上不存在属性'pictureUrl' '

我真的不明白我做错了什么，有人看到问题了吗？

这是我的 App 组件：

import React from 'react';
import  Root, Routes, addPrefetchExcludes  from 'react-static';
import  Link, Router  from '@reach/router';
import FancyDiv from 'components/FancyDiv';
import Dynamic from 'containers/Dynamic';
import './app.css';
import NavDomicile from './components/NavDomicile';

// Any routes that start with 'dynamic' will be treated as non-static routes
addPrefetchExcludes([ 'dynamic' ]);

function App() 
	return (
		<Root>
			<NavDomicile pictureUrl="./assets/logo-lavigo-domicile.png">
				<Link to="/">Home</Link>
				<Link to="/about">About</Link>
				<Link to="/blog">Blog</Link>
				<Link to="/dynamic">Dynamic</Link>
			</NavDomicile>
			<div className="content">
				<FancyDiv>
					<React.Suspense fallback=<em>Loading...</em>>
						<Router>
							<Dynamic path="dynamic" />
							<Routes path="*" />
						</Router>
					</React.Suspense>
				</FancyDiv>
			</div>
		</Root>
	);


export default App;

And My Nav Component : 

<!-- begin snippet: js hide: false console: true babel: false -->

import React,  ReactNode  from 'react';

interface INavProps 
	pictureUrl?: string;
	children?: ReactNode;


const NavDomicile: React.FC = ( children, pictureUrl : INavProps) => 
	return (
		<nav>
			<div>
				<img src=pictureUrl />
			</div>
			<div>children</div>
		</nav>
	);
;
export default NavDomicile;

【问题讨论】：

嘿，我的回答解决了你的问题吗？

嗨！很抱歉，我没有看到你的帖子，因为我没有收到任何提醒，它真的很有用，非常感谢！

【参考方案1】：

您应该为React.FC 的类型泛型提供接口

const NavDomicile: React.FC<INavProps> = ( children, pictureUrl ) =>