相关疑难解决方法(0)

如何收听contentEditable基于更改事件的控件？

var Number = React.createClass({
    render: function() {
        return <div>
            <span contentEditable={true} onChange={this.onChange}>
                {this.state.value}
            </span>
            =
            {this.state.value}
        </div>;
    },
    onChange: function(v) {
        // Doesn't fire :(
        console.log('changed', v);
    },
    getInitialState: function() {
        return {value: '123'}
    }    
});

React.renderComponent(<Number />, document.body);

http://jsfiddle.net/NV/kb3gN/1621/

目前

1. 我有一个 react 组件，newValue当用户单击 contentEditable 时<div>，它会存储一个，并newValue随着用户键入而更新。注意：我以这种方式设置此行为有两个主要原因：（1）我不想发送要在每次击键时保存的数据，以及（2）我计划使用此 div 的变体，其中检查每个输入以验证输入是否为数字。
2. 在newValue发送时，要保存<div>失去焦点，然后道具的状态复位。

问题

将onChangeHandler可编辑 div 中插入符号的位置移动到左侧。这导致击键123456显示为654321

代码：

class Input extends Component {

  constructor(props) {
    super(props);
    this.state = {
      //newValue input by user
      newValue : undefined
    }
  }

  //handler during key press / input
  onChangeHandler = event => {
    let targetValue =  event.currentTarget.textContent;
    this.setState({"newValue": targetValue})
  }

  //handler when user opens input form
  onBlurHandler = event => {
    //some …

我正在构建一个图库应用程序,我需要创建多个HTTP请求来拉取图库和条目(图像和视频).

由于库将自动滚动条目,我试图阻止重新呈现组件,当我发出后续HTTP请求并更新状态.

谢谢