如何在react-native中创建一个圆圈周围的渐变边界？我使用的是LinearGradient，但它填充的是圆圈

npm install react-native-linear-gradient --save

import React from 'react';
import { View } from 'react-native';
import LinearGradient from 'react-native-linear-gradient';

class CircleWithGradientBorder extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <LinearGradient
          colors={['#FF0000', '#00FF00', '#0000FF']}
          start={{ x: 0, y: 0 }}
          end={{ x: 1, y: 1 }}
          style={styles.gradient}
        >
          <View style={styles.circle} />
        </LinearGradient>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  gradient: {
    width: 200,
    height: 200,
    borderRadius: 100,
    justifyContent: 'center',
    alignItems: 'center',
  },
  circle: {
    width: 180,
    height: 180,
    borderRadius: 90,
    backgroundColor: 'white',
  },
});

class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <CircleWithGradientBorder />
      </View>
    );
  }
}