在React Native中与独立动画共享样式表吗？

Question

因此，假设我们分别创建了两个看起来非常相似的按钮，因此我们希望共享样式，但是具有不同的构造函数，这些构造函数具有不同的动画属性，我们希望将它们分配给这些样式，以便在共享样式时（保持在一个文件），分别针对每个按钮进行自定义。使用RN的StyleSheet：

const styles = StyleSheet.create({
    backgroundColor: this.interpolations.backgroundColor,
    padding: 15,
    margin: 10,
    marginBottom: 0,
    borderRadius: 4,
    borderWidth: 1,
    borderColor: this.interpolations.borderColor,
    marginBottom: this.animations.rise
});

可能会起作用，但是不允许我根据两个不同按钮的各自动画属性来设置其动画属性。我想要的是这样的：

// in the component's constructor once the animation values have been assigned
this.stylesheet = new StyleSheet(this);

//then later in the component's render code, we assign the style like this:
<Animated.View style={this.stylesheet.linkStyle("text-wrapper")}>

我认为这将是一个非常聪明的实现，这是StyleSheet的构造函数：

// in a separate file to define a shared stylesheet that will base its animation styles on each element's individual animation values
export default class StyleSheet {
  constructor(that) {
    this["text-wrapper"] = {
      backgroundColor: that.interpolations.backgroundColor,
      padding: 15,
      margin: 10,
      marginBottom: 0,
      borderRadius: 4,
      borderWidth: 1,
      borderColor: that.interpolations.borderColor,
      marginBottom: that.animations.rise
    };
    this["text"] = {
      textAlign: "center",
      fontSize: 20,
      fontWeight: "bold",
      opacity: 1,
      color: that.interpolations.textColor
    }
  }
  linkStyle(key) {
    if (this[key]) {
      return this[key];
    } else {
      throw "style key missing" + key;
    }
  }
}

但是事情搞砸了。动画发生了，但是它们是完全错误的，例如变成错误的颜色或根本没有发生。 有人可以解释一种更好的方法或我如何修正我的代码吗？