Taro 封装箭头组件

import { View } from "@tarojs/components"

interface HArrowProps {
    color?:string,
    lineWidth?:number, // 线的宽度
    breadth?:number, // 箭头的大小
    unfold?:boolean,
    fixedAngle?:number,
}

const HArrow = (props:HArrowProps) => {
    const {
        color = '#000000',
        lineWidth = 2,
        breadth = 5,
        unfold = false,
        fixedAngle
    } =  props
    return (
        <View style={{
            width:`${breadth}px`,
            height:`${breadth}px`,
            borderTop:`${lineWidth}px ${color} solid`,
            borderRight:`${lineWidth}px ${color} solid`,
            transform:`rotate(${fixedAngle || (unfold ? -45 : 135)}deg)`,
            transition: 'all 1s ease-out'
        }}>
        </View>
    )
}

export default HArrow