QML坑之canvas画虚线出现绘图状态混乱

测试版本：qt 5.12.7
通过setLineDash可以画虚线，如

Canvas{
	//...
	
	onPaint: {
	
	var ctx = getContext("2d")
	ctx.beginPath()
	ctx.strokeStyle = "black"
	ctx.lineWidth = 1
	ctx.setLineDash([])    //实线
	ctx.moveTo(100,100)
	ctx.lineTo(200,200)
	ctx.stroke()
	
	ctx.beginPath()
	ctx.setLineDash([2])    //虚线
	ctx.moveTo(100,200)
	ctx.lineTo(200,300)
	ctx.stroke()
	}
}

像上面onPaint只执行了一次是没问题的，但多次执行就会出现setLineDash乱套的问题 ，会出现绘制某个本应是实线的path时变成了虚线，某个本应是虚线的path变成实线。

property var elements: new Array()   

function newRectangle(x,y,w,h,color,dash)
{
    var elem = component.createObject(...)  //事先定义一个矩形的对象类型
    elem.item.color = color;
    elem.item.x = x;
    elem.item.y = y;
    elem.item.w = w;
    elem.item.h = h;
    elem.item.color = color;
    elem.item.dashSegment = dash;   //类型为数组，如 [] 、[5]
	elements.push(elem)
	canvas.requestPaint(); 
}
function newEllipse(x,y,w,h,color,dash)
{
//...
canvas.requestPaint(); 
}
function newLine(x0,y0,x1,x2,color,dash)
{
//...
canvas.requestPaint(); 
}



Canvas{
	id:canvas
	//...
	
	//根据元素的属性绘制元素
	function drawElement(ctx, elem)
	{
		//...
		ctx.setLineDash(elem.dashSegment)
		if(elem.role==="rectangle")   
		{
			ctx.rect(elem.x, elem.y, elem.width, elem.height)
		}
		else if(elem.role==="ellipse")  
		{
			ctx.ellipse(elem.x, elem.y, elem.width, elem.height, 0, 0, Math.Pi*2)
		}
		else if(elem.role==="line")
		{
			ctx.moveTo(elem.x0, elem.y0)
	        ctx.lineTo(elem.x1, elem.y1)
		}
		ctx.stroke()
	}	

	//用户不断添加新的元素至队列中，每次添加一个新的元素就触发一次onPaint事件
	onPaint: {
	
		var ctx = getContext("2d")

        //每次绘图前清空画布所有内容
        ctx.clearRect(0, 0, width, height);

        //遍历队列
        for(var i=0;i<elements.length;i++)
        {
            drawElement(ctx, elements[i]);
        }
	}
}