GridLayout does not evaluate the property "columns" and "rows" after component complete

import QtQuick 2.1
import QtQuick.Layouts 1.0

Rectangle {
    width: 640
    height: 480

    Rectangle {
        id: rectangle1
        x: 334
        y: 78
        width: 200
        height: 200
        color: "#ffffff"
    }

    Text {
        id: text1
        x: 83
        y: 207
        text: qsTr("Text")
        font.pixelSize: 12
    }

    Row {
        x: 37
        y: 37
    }

    GridLayout {
        id: layout
        x: 156
        y: 89

        Rectangle {
            id: rectangle2
            width: 106
            height: 80
            color: "#a03e3e"
        }

        Rectangle {
            id: rectangle3
            width: 106
            height: 80
            color: "#d71010"
        }

        Rectangle {
            id: rectangle4
            width: 106
            height: 80
            color: "#103bd7"

            MouseArea {
                id: mousearea2
                anchors.fill: parent
                onClicked: {
                    layout.columns = 2
                    print("clicked")
                }
            }
        }

        Rectangle {
            id: rectangle5
            width: 106
            height: 80
            color: "#10d734"

            MouseArea {
                id: mousearea1
                anchors.fill: parent
                onClicked: {
                    layout.columns = 1
                }
            }
        }
    }
}