在 React Native 中使用 View 创建 V 形答案

【问题标题】：Create a chevron using View in react native在 React Native 中使用 View 创建 V 形
【发布时间】：2022-01-11 21:25:48
【问题描述】：

我想使用视图创建一个 V 形，但是我不确定这是否超出了视图的范围。

我尝试使用如下所示的边框半径，但这只会使视图变圆。

import React, { Component } from 'react'
import { View, Text } from 'react-native'

export class Chevron extends Component {
    render() {
        return (
            <View
            style={{
                backgroundColor: "blue",
                borderTopRightRadius:90,
                borderBottomRightRadius:90, 
                borderTopLeftRadius:-90, 
                borderBottomLeftRadius:-90, 
            }}
            >
                <Text>{this.props.item}</Text>
            </View>
        )
    }
}

export default Chevron

【问题讨论】：

标签： react-native frontend

【解决方案1】：

如果您不想制作看起来复杂的形状，最好的办法是使用库 react-native-svg 您可以使用他们提供的 Polygon 来做到这一点 (https://github.com/react-native-svg/react-native-svg)

【讨论】：