vscode中使用antd框架的按钮提示 [英] Button hints using antd framework in vscode
本文介绍了vscode中使用antd框架的按钮提示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在 vscode 中使用了 antd 的 Button 和 Input.但它在按钮上显示错误,我想知道为什么.
我试过输入法,没有显示错误.如图所示.
从'react'导入React;从'./index.css'导入样式;从 'umi/router' 导入路由器;从'antd'导入{输入,按钮};导出默认函数(){const handleClick=()=>{router.push('/主页/');}返回 (<div className={styles.normal}><div className={styles.welcome}/><h1 className={styles.title}>登录</h1><ul className={styles.list}><li><label>用户名:</label><Input className={styles.input} placeholder="username"/></li><li><label>密码:</label><Input className={styles.input} placeholder="password"/></li><li><Button type="primary" shape="round" onClick={handleClick}>登录</Button>
);}
实际输出显示:
<--language:lang-none-->"message": "Type '{ children: string; type: \"primary\"; shape: \"round\"; onClick: () => void; }' 缺少类型 'Pick<Pick< 中的以下属性;(Readonly & Readonly<{ children?: ReactNode; }>) | (Readonly & Readonly<{children?: ReactNode; }>), \"defaultChecked\" | \"defaultValue\" | ... 257 更多... | \"block\"> & Pick<...> & Pick<...>, \"defaultChecked\" | ... 256 more ... | \"shape\">': defaultChecked、defaultValue、suppressContentEditableWarning、suppressHydrationWarning 等等."
另外,我想问一下如何使用静态资源?示例项目只是使用css背景url方式展示图片.
解决方案
您好,我已将 package.json 中的 @types/react 更新为 16.8.11.这解决了我的问题.
I'm using Button and Input of antd in vscode. But It shows error on Button and I want to know why.
I have tried Input, and it shows no error. Which is showed in the picture.
import React from 'react';
import styles from './index.css';
import router from 'umi/router';
import {Input, Button} from 'antd';
export default function() {
const handleClick=()=>{
router.push('/homepage/');
}
return (
<div className={styles.normal}>
<div className={styles.welcome} />
<h1 className={styles.title}>login</h1>
<ul className={styles.list}>
<li><label>username:</label><Input className={styles.input} placeholder="username"/></li>
<li><label>password:</label><Input className={styles.input} placeholder="password"/></li>
<li>
<Button type="primary" shape="round" onClick={handleClick}>login</Button>
</li>
</ul>
</div>
);
}
The actual output shows:
<--language:lang-none-->
"message": "Type '{ children: string; type: \"primary\"; shape: \"round\"; onClick: () => void; }' is missing the following properties from type 'Pick<Pick<(Readonly<AnchorButtonProps> & Readonly<{ children?: ReactNode; }>) | (Readonly<NativeButtonProps> & Readonly<{ children?: ReactNode; }>), \"defaultChecked\" | \"defaultValue\" | ... 257 more ... | \"block\"> & Pick<...> & Pick<...>, \"defaultChecked\" | ... 256 more ... | \"shape\">': defaultChecked, defaultValue, suppressContentEditableWarning, suppressHydrationWarning, and 250 more."
plus, I want to ask how to use static resource? The sample project just use the css background url way to show pictures.
解决方案
Hello I have updated @types/react as 16.8.11 in my package.json. This solved my problem.
这篇关于vscode中使用antd框架的按钮提示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文