React Native剛開始做，沒有虛線控制元件，也沒有Android中xml畫虛線方便，可以用下面辦法來實現。

實現思路：
1.拿到一個寬度width，求出虛線長度len
2.生成一個數組arr，（後面會根據陣列元素畫n個view，組合成虛線）
3.生成虛線

import React from 'react';
import {
    Text,
    View,
    StyleSheet,
    Dimensions,
} from 'react-native';
const screenWidth = Dimensions.get('window').width;

export default
 
 class DashLine extends Component{
    render(){
        var len = Math.ceil(screenWidth/4);
        var arr = [];
        for(let i=0; i<len; i++){
            arr.push(i);
        }

        return <View style={styles.dashLine}>
            {
                arr.map((item, index)=>{
                    return
 
 <Text style={styles.dashItem} key={'dash'+index}> </Text>
                })
            }
        </View>
    const styles = StyleSheet.create({
    dashLine: {
        flexDirection: 'row',
    },
    dashItem: {
        height: 1,
        width: 2,
        marginRight: 2,
        flex: 1
 
,
        backgroundColor: '#ddd',
    }
})

這裡是水平方向的虛線 ，要是垂直方向的虛線，只需要修改下 dashLine，dashItem的樣式

const styles = StyleSheet.create({
    dashLine: {
        flexDirection: 'column',
    },
    dashItem: {
        height: 2,
        width: 1,
        marginRight: 2,
        flex: 1,
        backgroundColor: '#ddd',
    }
})

const screenWidth = Dimensions.get(‘window’).width;修改為：

const screenHeight = Dimensions.get('window').height;

虛線就定義好了

使用：

   <View style={{ overflow: 'hidden',
        backgroundColor: '#999',
        margin: 10}}><DashLine/></View>