在React中更新渲染形式的函数

Question

我对Reacts渲染的工作方式一无所知，我想知道如何或是否有可能从函数中创建的变量中更新样式元素。请参阅以下内容：

这是我的函数，用于确定sytle元素“ gridTemplateColumns”的列数。

 function getSize() {
        var number 10
        var ColumnNo= "";
        for (var i = 0; i < number; i++) {
            ColumnNo+= "auto ";

        }

    }'

这是样式里面的网格容器：

<div className="grid-container" style={{ "gridTemplateColumns": styletest }}>

我知道在加载页面时它可以工作，但是如何使用此新变量更新渲染？

Answer 1

您必须将变量置于组件状态，并使用setState更新或使用prop将其传递给组件，并从父组件更新值。

这样，每次变量更改时，都会调用render函数。