Question

我正在使用react和redux做一个应用程序，我想做一些动态表单，尝试生成输入块，比如todo list app，这是一个例子：

<ul>
    <li>   
        <input type="text" ref="title" name="title" placeholder="title" autofocus/>
   </li>
   etc...
</ul>

但我不知道如何获得这些输入的值，在Redux中执行此操作的最佳方法是什么？我使用ref进行了大量测试，但由于我的输入是动态添加的，我不知道如何实现这一点，你能帮我吗？

Answer 1

除非你绝对必须，否则不要使用裁判！我能想到的唯一用例就是聚焦它们，或者做一些模糊的DOM。

为此，只需要做一些事情：

＆＃13;

class DynamicInputs extends React.Component {
  doSomethingWithValue(item, newValue) {
    // Here you can dispatch an action to update the value, etc.
  }
  
  renderItems() {
    this.props.items.map( item => {
      return (
        <input 
          value={item.value} 
          onClick={ev => this.doSomethingWithValue(item, ev.target.value)}
      );
    })
  }

  render() {
    return <div>{this.renderItems()}</div>
  }
}

＆＃13;

这个想法是你的redux商店中存在的items，并作为道具传递给这个组件。然后，您可以调度操作以更改doSomethingWithValue方法中的这些项目。该方法交给项目，以便您可以识别它，以及新值，以便您可以更新它。

如果您希望能够添加待办事项，那只需要调度将新项目推送到items数组的操作：）

Answer 2

# simulate
n <- 10
nr <- 24
nc <- 8000
test <- list()
set.seed(1234)
for (i in 1:n){
  test[[i]] <- matrix(rnorm(nr*nc),nr,nc)
}

> system.time( res <- matrix( as.numeric( unlist(test) ) ,nr,nc*n) )
 user  system elapsed 
0.114   0.006   0.120

语法中有一些小错误，但这个版本对我有用，谢谢

动态生成的表单中的Redux值

2 个答案: