当前位置: 首页 > 工具软件 > linaria > 使用案例 >

taro + linaria styled 报错 Property ‘__linaria‘ is missing

郑正文
2023-12-01

更新, 下面的解决方案不好,估计暂时不支持,我先用css 功能。

报错信息

/*
 * @FileDescription: 
 * @Author: 刘凯
 * @Date: 2021-04-26 08:53:19
 * @LastEditors: 刘凯
 * @LastEditTime: 2021-04-26 13:10:03
 */
import React from 'react'
import { View } from '@tarojs/components'
import { styled } from 'linaria/react'

const Title = styled(View)<{ color: string }>`
  color: ${props => props.color}`; // 抛红报错

const Index: React.FC = () => {
  return <Title color='red'>
    Hello World!
  </Title>
}

export default Index
Argument of type '(props: any) => any' is not assignable to parameter of type 'StaticPlaceholder'.
  Property '__linaria' is missing in type '(props: any) => any' but required in type 'StyledMeta'

报错大概原因

View 组件props 声明是没有 style 属性的, 所以导致 styled(View) 有问题, 尝试在View 组件的类型声明中 添加 style 声明后就不报错了。

报错解决方案

通过 styled.view 方式来替换 styled(View)

/*
 * @FileDescription: 
 * @Author: 刘凯
 * @Date: 2021-04-26 08:53:19
 * @LastEditors: 刘凯
 * @LastEditTime: 2021-04-26 13:10:03
 */
import React from 'react'
import { View } from '@tarojs/components'
import { styled } from 'linaria/react'

const Wrapper = styled.view<{color: string}> `
    color: ${props => props.color}
`

const Index: React.FC = () => {
  return <Title color='red'>
    Hello World!
  </Title>
}

export default Index
 类似资料: