React TypeScript 样式报错

代码如下:

报错内容:

Type '{ flexDirection: string; }' is not assignable to type 'Properties<string | number, string & {}>'.

Types of property 'flexDirection' are incompatible.

Type 'string' is not assignable to type 'FlexDirection | undefined'.ts(2322)

index.d.ts(1942, 9): The expected type comes from property 'style' which is declared here on type 'DetailedHTMLProps<HTMLAttributes, HTMLDivElement>'

解决方案 1:

typescript 复制代码
const myStyle = {
  flexDirection: "column",
} as React.CSSProperties;

解决方案 2:

typescript 复制代码
class MyView extends Component {
  render() {
    return <div style={myStyle as React.CSSProperties}>my view</div>;
  }
}
相关推荐
SkylerHu4 分钟前
前端代码规范:husky+ lint-staged+pre-commit
前端·代码规范
菜鸟una13 分钟前
【微信小程序 + 消息订阅 + 授权】 微信小程序实现消息订阅流程介绍,代码示例(仅前端)
前端·vue.js·微信小程序·小程序·typescript·taro·1024程序员节
Yeats_Liao15 分钟前
Go Web 编程快速入门 05 - 表单处理:urlencoded 与 multipart
前端·golang·iphone
飞翔的佩奇20 分钟前
【完整源码+数据集+部署教程】【运动的&足球】足球场地区域图像分割系统源码&数据集全套:改进yolo11-RFAConv
前端·python·yolo·计算机视觉·数据集·yolo11·足球场地区域图像分割系统
拉不动的猪21 分钟前
h5后台切换检测利用visibilitychange的缺点分析
前端·javascript·面试
桃子不吃李子31 分钟前
nextTick的使用
前端·javascript·vue.js
萌新小码农‍1 小时前
SpringBoot+alibaba的easyexcel实现前端使用excel表格批量插入
前端·spring boot·excel
冰暮流星1 小时前
css3新增背景图片样式
前端·css·css3
书唐瑞2 小时前
谷歌浏览器和火狐浏览器对HTML的嗅探(Sniff)能力
前端·html
rocky1912 小时前
谷歌浏览器插件 使用 playwright 回放用户动作键盘按键特殊处理方案
前端