Animated.View 的样式道具的打字稿定义

问题描述

我有一个组件，其 Props 接口从 React Native 扩展了 ViewProps，即:

I have component whose Props interface extends ViewProps from React Native, i.e:

export interface Props extends ViewProps {
  // Custom props
}

当然，这扩展了 style 属性.有一个警告，我正在使用 Animated.View 并且有这样的风格:

Naturally, this extends the style prop. There is one caveat, I am using Animated.View and have style like this:

style={{
  opacity: animationCharacter.interpolate({
    inputRange: [0, 1],
    outputRange: [0, 1]
  }),
  transform: [
    {
      scale: animationCharacter.interpolate({
        inputRange: [0, 1],
        outputRange: [1.2, 1]
      })
    }
  ]
}}

我认为 interpolate 调用与来自 ViewProps 的样式类型不兼容，但没有我可以扩展的 AnimatedViewProps.

I think the interpolate call is incompatible with style typings from ViewProps, but there is no AnimatedViewProps I can extend.

这里有解决方案还是我必须设置style: any?

Is there a solution here or will I have to set style: any?

推荐答案

我不相信有内置解决方案.查看 React Native 的类型定义，Animated 命名空间甚至没有为 Animated 组件指定类型，并且 将它们保留为any:

I don't believe there's a builtin solution. Looking at the type definitions for React Native, the Animated namespace doesn't even specify types for the Animated components, and just leaves them as any:

/**
 * Animated variants of the basic native views. Accepts Animated.Value for
 * props and style.
 */
export const View: any;
export const Image: any;
export const Text: any;
export const ScrollView: any;

即使是 React Native 源(使用 FlowType)也将 props 留给了一个 普通对象类型:

Even the React Native source (which uses FlowType) leaves the props to an a plain Object type:

class AnimatedComponent extends React.Component<Object> {
  …
}

这可能是因为 React Native 具有用于内部处理动画的包装类 样式 和 道具(甚至 转换)特别是，由于抽象，使得精确指定类型变得更加困难.我认为最好的办法是使用 any，因为创建自己的类型会非常乏味，而且几乎没有什么好处.

This is probably because React Native has wrapper classes for internally handling animated styles and props (even transforms) specifically, making it a lot harder to specify types exactly due to abstraction. I think your best bet here is to use any since it would incredibly tedious to create your own types, and with little benefit.

这篇关于Animated.View 的样式道具的打字稿定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！