Question

我正在尝试从方法中添加动态状态。我的想法是当我从render方法调用方法时，它会接受参数值来设置动态状态值。

这是我的代码：

renderFeaturePermissionOptions( featureName ) {
  // Generate permission rules.
  let viewPermission    = featureName + "_view"
  let createPermission  = featureName + "_create"
  let editPermission    = featureName + "_edit"
  let deletePermission  = featureName + "_delete"
  // Set states for all dynamic checkboxes.
  this.setState( { [viewPermission]   : true } )
  this.setState( { [createPermission] : true } )
  this.setState( { [editPermission]   : true } )
  this.setState( { [deletePermission] : true } )
  return(
    <tr>
      <td>{featureName}</td>
      <td><input name={ featureName + "/selectAll" } type="checkbox" onChange={this.checkSiblingCheckBoxes}/></td>
      <td><input name={ featureName + "/view" } type="checkbox"/></td>
      <td><input name={ featureName + "/create" } type="checkbox"/></td>
      <td><input name={ featureName + "/edit" } type="checkbox"/></td>
      <td><input name={ featureName + "/delete" } type="checkbox"/></td>
    </tr>
  )
}

我想重构这段代码，以便我可以为参数中给出的任何路由名称调用此方法，它将创建状态作为参数名称。

虽然没有完成，但是我从像这样的渲染方法中调用这个方法

{ this.renderFeaturePermissionOptions( 'Organization' ) }

它需要一个无限循环并生成此错误：

我如何设置这些来自renderFeaturePermissionOptions( 'Contact' )参数的状态？ - ＆GT;一个示例电话。

Answer 1

你不能在渲染函数中调用{ "difference": "P9Y9M14D" }，当你调用setState时，如果你在setState函数中调用它，组件将再次渲染。它将是无限循环。

所以你可以尝试把它写成另一个childComponent，也许它看起来像这样。

render

Answer 2

在渲染发生时，不应在渲染方法或被调用的方法中设置状态。

这在您的代码中不正确。

new Thread() {
            public void run() {
                while (i-- > 1) {
                    try {
                        getActivity().runOnUiThread(new Runnable() {
                            @Override
                            public void run() {
                                txt_timer.setText(String.valueOf(i));
                            }
                        });
                        Thread.sleep(1000);
                    } catch (InterruptedException e) {
                        e.printStackTrace();
                    }
                }

                txt_timer.setText("GO");
            }
        }.start();

在某些生命周期方法中或在组件上的某些用户操作中设置状态。

修改是初始化组件构造函数中的默认状态

// Set states for all dynamic checkboxes. this.setState( { [viewPermission] : true } ) this.setState( { [createPermission] : true } ) this.setState( { [editPermission] : true } ) this.setState( { [deletePermission] : true } )

无法从渲染方法设置动态状态反应es6

2 个答案: