Question

基本上我使用反应输入，当我点击一个按钮时它不能让它的文本值更新，但是它旁边的值会在重新渲染时得到更新。我还使用Redux调用服务来更新值。

例如，如果输入数量加载值为55，我点击＆＃39; +＆＃39;按钮我希望输入数量更新为56，然后它旁边的值为56.（它旁边的值是出于调试目的）。实际发生的是输入值保持在55并且它旁边的值更新为56.知道问题是什么吗？

我有以下代码：

class GroceryItemEditModal extends Component {
  constructor(props) {
    super(props);

    this.toggle = this.toggle.bind(this);
    this.addItem = this.addItem.bind(this);
    this.removeItem = this.removeItem.bind(this);
    this.handleQuantityChange = this.handleQuantityChange.bind(this);
    this.handleQuantityBlur = this.handleQuantityBlur.bind(this);
  }

  componentWillReceiveProps(nextProps) {
    if (nextProps.refreshEditItemData === true) {
      this.props.loadEditItem(this.props.selectedEditItem.Id);
    }
  }
  componentDidMount() {
    if (this.props.selectedEditItem) {
      this.props.loadEditItem(this.props.selectedEditItem.Id);
    }
  }
  addItem() {
    const quantity = this.props.selectedEditItem.Quantity + 1;

    this.props.setEditItemQuantity(this.props.selectedEditItem.Id, quantity);
  }
  removeItem() {
    const quantity = this.props.selectedEditItem.Quantity - 1;

    this.props.setEditItemQuantity(this.props.selectedEditItem.Id, quantity);
  }
  handleQuantityBlur(event) {
    const quantity = event.target.value;

    this.props.setEditItemQuantity(this.props.selectedEditItem.Id, quantity);
  }
  toggle() {
    this.props.toggleEditItemVisibility(!this.props.showEditItem);
  }
  render() {
    if (!this.props.selectedEditItem) {
      return <div />;
    }
    let spinner = '';
    if (this.props.modifyingEditItem) {
      spinner = <FontAwesome name="spinner" spin />;
    }
    return (
      <div>
        <Modal isOpen={this.props.showEditItem} toggle={this.toggle} className={this.props.className}>
          <ModalHeader toggle={this.toggle}>Edit Grocery Item</ModalHeader>
          <ModalBody>
            <div>{this.props.selectedEditItem.Name}</div>
            <Form>
              <FormGroup>
                <Label for="blah">Quantity</Label>
                <Row>
                  <Col xs="1">
                    <Button color="primary" onClick={this.removeItem}>-</Button>
                  </Col>
                  <Col xs="9">
                    <Input name="selectedItemQty" id="selectedItemQty" Value={this.props.selectedEditItem.Quantity} onBlur={this.handleQuantityBlur}></Input>{this.props.selectedEditItem.Quantity}
                  </Col>
                  <Col xs="1">
                    <Button color="primary" onClick={this.addItem}>+</Button>
                  </Col>
                  <Col xs="1">
                  </Col>
                </Row>
              </FormGroup>
            </Form>
            {spinner}
          </ModalBody>
          <ModalFooter>
            <Button color="primary" onClick={this.toggle}>Close</Button>{' '}
          </ModalFooter>
        </Modal>
      </div>
    );
  }
}

Answer 1

组件输入中的道具值是否拼写清楚？

#include "ComplexTypes.h"
#include <string>
#include <map>
#include <vector>

std::vector<pixel> pixels;
std::map<std::string, sprite> sprites;

void pixelsInit(){};

void spritesInit(){};

void pixelsUpdate(){};

void spritesUpdate(){};

Answer 2

您可以尝试以下内容：

使用属性＆＃34; key＆＃34;在输入组件上，并在输入组件呈现时给它一个随机ID ...像这样：

＆LT;输入键= {shordid.generate（）} ....无论道具......。＆gt;

React输入值未获得更新，尽管具有相同变量的值旁边的值为

2 个答案: