Question

我正在使用Redux形式包装的控制器（-/ +）输入数字：

我不知道如何使它生效并通过控制器更新我的价值。现在，它仅在输入内部的onChange上起作用。

我的控制器可以接收一些外部函数来更新该值，但是我不知道如何。当然，我不是具有redux和redux形式的忍者。

有什么想法吗？

谢谢

Answer 1

您是否曾在自定义组件中尝试过onChange？看看de api https://redux-form.com/6.6.3/docs/api/field.md/时，他们说“要了解将要传递到您的组件的道具，请参阅下面的道具部分。”

import React, { Component } from "react";
import PropTypes from "prop-types";

class NumberInput extends Component {
  static propTypes = {
    input: PropTypes.any,
    onChange: PropTypes.func,
    min: PropTypes.number.isRequired,
    max: PropTypes.number.isRequired,
    label: PropTypes.string,
    errorMessage: PropTypes.oneOfType([PropTypes.string, PropTypes.bool])
  };

  static defaultProps = {
    onDecrement: null,
    onIncrement: null,
    onChange: null,
    errorMessage: false
  };

  render() {
    const {
      input,
      onChange,
      value,
      min,
      max,
      label,
      errorMessage
    } = this.props;
    let val = value || min;
    // MAIN
    return (
      <div className="number-input__content">
        <div>
          <button
            type="button"
            onClick={() => onChange(val > min && value - 1)}
          >
            -
          </button>
          <input
            type="number"
            pattern="[0-9]"
            defaultValue={min}
            value={val}
            min={min}
            max={max}
            onChange={onChange}
            {...input}
          />
          <button
            type="button"
            onClick={() => onChange(val < max && value + 1)}
          >
            +
          </button>
        </div>
      </div>
    );
  }
}

export default NumberInput;

https://codesandbox.io/s/j2zy4ynp8w

如何使用控制器实现输入类型编号（带redux格式）

1 个答案: